Notebook App (iOS) Look and Feel Sample

Notebook app teaser image 2.jpg

The Challenge  

Design five screens to illustrate a sample look and feel for a note-taking iOS app inspired by Dieter Ram’s, “less, but better” motto.  


This project was an assignment of the UI design bootcamp I completed at CareerFoundry. It was an exercise in creating an original look and feel and extensible UI components.



UI Design
User Flow

Time Frame

July, 2018


“Less, but Better”  

My approach was to use colors and typography that are not flashy or fussy as to distract from the content of users’ notes. I chose a greyish green and dark pink as primary colors with orange as an accent color to provide personality and differentiate it from typical white background productivity apps. For typography, I selected Source Sans Pro for its approachable feeling, readability, and efficiency.   

To embody “less, but better,” I designed the app with minimal features; the navigation only includes sections for notes, adding a new note, and settings. Notebooks are represented with recognizable illustrations, and the notes contain simple formatting controls as well as ways to add photos or attachments. This project was an exercise in creating an original look and feel while designing within the guidelines of iOS Human Interface Guidelines.

Final Screens@3x.jpg

Typography & Color

Typography and Color@3x.jpg

UI Elements

UI Elements@3x.jpg

User Flow & Wireframes

user flow
Low Fidelity Wireframes@3x.jpg
Medium-Fidelity Wireframes@3x.jpg

Final Product

Final Product@3x.jpg