Web Application Interface Design

WEB APPLICATION DESIGNnvALT Conceptual Design Approach

Hello. I’m a digital note taking junkie. Admitting my addiction is the first step for liberation. I tried plenty of apps for note taking, both for mac and iOS. There are beautiful things in each, but none of them is perfect. I decided to take a shot and integrate concepts that I like in each application and design a perfect one.

1 Prototyping & UX design

Basic ideas

If I had to choose among existing applications I would use nvALT, Notational Velocity fork from Brett Tepstra, and build features on top of it. I’m focusing on: Markdown support while typing, beautiful typography, overall layout design and spacing.

2 Interface Design

Notes List screen

On the left hand side there is a notes list and a New Note button. Advanced users can remove the New Note button in settings panel and create notes with a keyboard shortcut cmd + n. On the right hand side there is a note preview and an edit screen.

Information Panel

Information panel gives options to publish a note via Simplenote or share it via email or social networks. Users can also archive or delete the note via this panel.

Focus Mode

In digital environment removing distractions and focusing on one thing at a time is essential. In this case focus mode allows undistributed writing. Utilized are best practices that are set up by ByWord and IA Writer.