SCROLL UI/UX DESIGN
PROJECT DESCRIPTION:
Scroll is a virtual journaling app that aims to provide creative journaling freedom in a digital space. It is designed with creative thinkers in mind allowing users to customize and attune their virtual journal to their own interests and personalities.
​
Scroll is designed for users who are searching for a digital alternative to bullet journaling or scrapbooking. These art forms are very reliant on creative supplies and materials, requiring space, money, and resources to complete layouts. Scroll offers a digital solution by providing all content in a digital space. It is best suited for forms of creative journaling however, due to the customization features of the app, the program can be adapted to even the barest or most complex of layouts, allowing it to function for all journaling styles. The app provides users with layout templates as well as digital decorative materials such as: stickers, illustrations, washi-tape, stamps, patterns, brushes, or even stock images. Users can also access their own photos through the photostream or through the app’s scanning feature.
​
PROJECT DELIVERABLES:
Final Prototype:
-
Link to Final Prototype: https://xd.adobe.com/view/d13c9449-1ce8-4ef5-9b06-3bb5bc7067c0-846f/
PERSONAS
Developing various user personas for Scroll allowed for the better understanding of users and their needs.
Persona 01
Persona 02
FLOW MAPS
By mapping the tasks of the user personas, I was able to gain a holistic understanding of how users would navigate the Scroll interface and where they may encounter friction or usability issues. This stage also allowed for the ideation of additional features to include in the interface.
Persona 01 Map
Persona 02 Map
SITE MAP
Developing a site map for Scroll created a sense of hierarchical structure of the app’s information architecture. This stage allowed for the organization of content, pages, and features, and a general understanding of the app layout.
WIREFRAMES
The wireframe stage provided a skeletal framework for the layout of a digital interface. Iterations and dimensions are included for both phone and laptop screens to provide a range of mobility and versatility based on user preferences.
Wireframe Sketches 01
Wireframe Sketches 02
Digital Wireframes
FINAL PROTOTYPE
The final prototype allows user to glimpse an example of Scroll journaling. There are examples of both phone, tablet, and laptop screens for versitility and range of creative needs. There are also examples of user customization , template saving features, community connections, notetaking, and calender tracking.
Adobe XD Prototype Screens
Adobe XD Prototype Pathways
Hi-Fidelity Screens