Yoreevo

Product Design, UI/UX Design, Secondary Research, User Interviews, Art Direction, Design Workshops, Mobile Designs

About Product

Yoreevo came to me looking to launch an update to their mobile app and web design to increase new users and drive sales. My primary challenge was redesigning the existing interface while implementing the latest design trends and strengthening Yoreevo’s visual brand identity. As Product Designers, it is always crucial to ensure that the user journey through the product is also easy, enjoyable, and impactful. I approached this project with the purpose of creating a seamless user experience with a user interface design that reflects the modern, approachable nature of the brand.

The Process

Throughout the design process, I worked with Yoreevo to integrate and work within the rulesand guidelines of the brand identity. We reviewed the existing branding materials with the teamand applied my expertise as product designers to improve and expand upon those materials.Our goal was to translate the brand identity into a digital experience. I created a designsystem that would embody minimalistic branding and emulate current design trends. Thisincluded choosing the best font, icon designs, shaping design components, and colour designfor web and mobile interfaces.

Research and Strategy

My goal was to develop a strategy to uncover pain points, user expectations, and otheressential insights. I used the Design Thinking framework to empathize with the targeted usersthrough proven UX Research methodologies. Preliminary research included userinterviews, user testing, competitive analysis, and discovery methods. By analyzing this userresearch, I was able to create a concept strategy that would meet Yoreevo’s goals and userneeds simultaneously.

Wireframes

The wireframe phase was crucial for the final concept visualization and journey testing. Withthe research and strategy mapped out, I created detailed wireframes for all of the criticalphases in the user journey. We conducted user testing with the wireframes to find theremaining pain points and areas for improvement. The low-fidelity nature of the wireframesallowed me to test assumptions in the user flow and visual mapping, before committing to high-fidelity designs.

Web Product

I emphasized the website UI in our design stage. I created an intuitive and minimalisticinterface that would invite users to interact with the website. The website design featuressimplistic UI features that emphasize the principal call to action moments. I used colour,hierarchy, and space strategically with validated findings from user testing to provide the bestexperience for users looking to accomplish tasks with Yoreevo.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system

image caption