What is Daydreams?
Daydreams is an iOS app that allows users to shop and sell vintage clothing from home.
Daydreams is an iOS app that allows users to shop and sell vintage clothing from home.
Purpose and Role
The purpose of this project was to create a clothing app that solves user problems and frustrations with existing vintage buy-and-sell apps. Daydreams provides a platform that is sleek and elegant with a retro flair. My role in this project was to create and put together all UI deliverables.
The purpose of this project was to create a clothing app that solves user problems and frustrations with existing vintage buy-and-sell apps. Daydreams provides a platform that is sleek and elegant with a retro flair. My role in this project was to create and put together all UI deliverables.
Objectives and Deliverables
- To design the UI for the mobile version of a vintage clothing sales app and prepare for handoff to developers.
- Create 4 functionalities for the app: create a profile, upload items to sell, leave reviews for other sellers, and create wish lists.
- To design the UI for the mobile version of a vintage clothing sales app and prepare for handoff to developers.
- Create 4 functionalities for the app: create a profile, upload items to sell, leave reviews for other sellers, and create wish lists.
Tools
Adobe XD
Adobe XD
Low Fidelity Wireframes
Mood Board and Color Palette
The next phase of the project was to create a mood board. I wanted the app to be a visual representation of a daydream, so I looked for earthy inspiration like blues skies and wildflowers. With my inspiration in mind, I pulled dominant colors from the imagery to create two color palette options.
Ultimately, I decided to use Color Palette 1 for the app because it felt like the more cohesive and simple option of the two palettes. I wanted to stick to the “dreamy” and “nostalgic” moods from my vision board and felt that the split color scheme of dark blue, light blue, and yellow was on-theme.
Text Stylesheet
My next task was to design the text stylesheet for Daydreams. This included titles, headings, body text styles, content lists, and button states. I chose a bold serif font for the headings to emphasize the vintage aspect of the app and a sans serif font for the body text to make reading on a screen easier on the eye.
Icons
Before adding style to the wireframes, I created a custom icon set for the app’s toolbar. I decided on a traditional and simplistic style so that user would face no confusion when it came to navigating the app.
Inactive Icons
Active Icons
Final Mockups
With my style guide complete, I applied all of the design elements to my wireframes and created the following mockups. Along with the color palette and icons, I created custom organic shapes (seen below in yellow) to match the earthy, daydream theme.
