Titilayo Faulkner

ReStyler- Your personal fashion organizer Project name: ReStyler Role: UX/UI Designer Duration: 4weeks Tools: FigJam, Figma, Google Forms and Zoom Platform: Mobile App (iOS) Scope: UX Research, Wireframing, UI Design, Prototyping, Design system Overview: ReStyler is a mobile app that gives users inspirations on how to style an outfit based on their body size, arrange their wardrobe, combine colors and generate outfits based on what they already own using the AI feature. The goal was to create a seamless and engaging experience that reduces repeated outfit and promotes sustainable fashion habits. Problem Statement: Many users struggle with daily outfit planning and often forget items in their wardrobe, leading to repeated outfit and unnecessary shopping.While there are apps that offer style inspiration or social fashion content, very few provide a personalized, wardrobe-based experience focused on utility and simplicity. The challenge was to design an intuitive and visually appealing tool that allows users to upload, organize, and style outfits based on their own clothing and their body size. Solution: ReStyler is a wardrobe styling app that help users: Get inspiration on how to style their cloth Know outfit that fit their body size Get outfit challenge to help users not repeat outfit Know how to mix different color ( color combinations) An AI assistant to help with fashion issues Wardrobe arrangement inspiration Upload their own outfit combination to inspire other users Target Audience Young adults (18–35), mostly female Fashion lovers and content creators People who want to declutter and simplify their style Users looking for sustainable fashion habits Research To understand how people currently manage their wardrobes and choose outfits, I conducted both quantitative and qualitative research. 1. Methods Used Google Forms Survey – 17 responses User Interviews – 10 participants Competitor Analysis – Pinterest, Instagram, TikTok. 1. Research goals To identify how users plan their outfit. To understand the frustrations around outfit combinations and wardrobe organization. To learn what feature users want in a fashion app. To identify pain point users face when choosing an outfit and combining colors. ReStyler- Your personal fashion organizer 1 1. Key insight 50% of users don't keep track of the cloth they own, they just discover they have some cloth by accident while the other 50% keep track of the outfit they own based on the arrangement of the wardrobe. 50% of users/ participants use social media like Pinterest, TikTok and Instagram for inspiration while the other 50% don't have an app for style inspiration. Users repeat outfits mostly 2-3 times a week and they feel unkept, annoyed, and uncomfortable with it. Users plan their outfit ahead usually 1-2 days before an event( church, parties, work etc) just to see if they fit. 90% of users don't know outfits that fit their body size. 1. Targeted audiences Young adults Fashion lovers Those who care about their appearance and fashion style Those who check social media for inspiration Those who feel their have nothing to wear even with a full wardrobe 1. User persona Name: Praise Age: 30. Occupation: Receptionist. Location: Lagos State, Nigeria. Pain point: struggling with putting outfits together, color combinations, not knowing outfits that fit her body size and a wardrobe full of clothes but still feel like she has nothing to wear. Solution Based on the research findings, I designed ReStyler to serve as a personal, digital wardrobe assistant that helps users take control of their style without needing to shop for more clothes or buying clothes that don't fit their body size. This app focuses on simplicity, personalization and ease of use, addressing the key frustration identified during research. User flow mapping Onboarding → App intro screens + permissions Sign Up / Log In → Email or social sign-in ReStyler- Your personal fashion organizer 2 Homepage → 30days challenge →Trending style → AI ReStyler- Your personal fashion organizer 3 Search → Search and camera section → clothing and colour categories ReStyler- Your personal fashion organizer 4 Wardrobe →Wardrobe arrangement inspo ReStyler- Your personal fashion organizer 5 Profile →Upload → Favourite ReStyler- Your personal fashion organizer 6 Setting → account settings → Support ReStyler- Your personal fashion organizer 7 Done Design Process ReStyler- Your personal fashion organizer 8 1. Mid-Fidelity Wireframes I sketched key screens in FigJam to map layout and functionality before designing this are the pages i did wireframe for: App intro page Sign in page Sign up page Homepage 10 days challenge page AI page Search page Different type of outfit pages Profile page Settings page https://www.figma.com/board/UUiFXewhBxyWlYfgtB7fTM/empathy-assignment?node-id=0-1&t=RIdDaYvPX2zH6Ya X-1 1. Style guide and design system To ensure visual consistency across all screens, I created a style guide and design system in figma. This includes colour, text styles and layout 1. Colour palette: Background colour: F1E6DE Primary colour: F8F8F8 Secondary colour: 1E1E1E 1. Typography: Heading text: inter black 20px Subheading: inter medium 15px Body text: inter semi bold 15px 1. Layout guide Layout: columns Count: 4 Type: stretch Margin: 16 Gutter: 16 3. Prototype To test the functionality and improve the overall experience, created an interactive mid fidelity and a high fidelity prototype in figma. The iterative approach allowed me to validate the user flow, adjust layout decisions and refine visuals. The prototype workflow: Mid- fidelity prototype: it focuses on layout structure and core feature ( no color or visual). I created all the pages from my mid fidelity wireframe in my mid fidelity prototype starting from the App intro page to the end. Based on feedback I got from, I transitioned the same mid fidelity prototype into high fidelity screens with final typography, colors, icons, and imagery. ReStyler- Your personal fashion organizer 9 The final user interface of the ReStyler app reflects a clean, modern, and fashion-forward aesthetic. Every screen was carefully designed in Figma to ensure consistency, clarity, and ease of use. I applied the established style guide and design system to create a cohesive visual experience, with a neutral color palette that lets the clothing items stand out. 1. Key Screens Here are some of the core high-fidelity screens included in the final design: App intro page Sign in page Sign up page Homepage 10 days challenge page AI page Search page Different type of outfit pages Profile page Settings page 2. Design Highlights Soft, neutral tones for a clean fashion interface Rounded buttons and icons for a modern mobile feel Simple tab navigation with active state feedback Legible typography using system-friendly fonts ReStyler- Your personal fashion organizer 10 Fully responsive layout optimized for mobile viewing Experience the full interactive flow of the ReStyler: https://www.figma.com/proto/w0j71ajYCtWUjyDtWBMVRZ/Untitled?node-id=68-111&p=f&t=bxg9elydkFIkHV3k-0&sc aling=scale-down&content-scaling=fixed&page-id=0%3A1&starting-point-node-id=60%3A5 Outcome: The ReStyler app delivers a simple, stylish, and user-friendly experience for fashion lovers who want to organize their wardrobe digitally and plan outfits with ease. By designing a complete product flow — from uploading clothes to styling looks and knowing your perfect body size outfit. I was able to build a fully functional mobile prototype that aligns with the core user goals: effortless styling, easy planning, and wardrobe control. The final UI reflects a clean, minimal design system with intuitive navigation, responsive layouts, and a user-centered flow — all created and prototyped in Figma. Final Deliverables: Mid-fidelity wireframes Mid- and high-fidelity Fully interactive Figma prototype Style guide & design system User flows & onboarding Responsive layout for key screens This project helped me strengthen my skills in UX research, wireframing, prototyping, and design systems while solving a real-world fashion challenge for digital-first users. ReStyler- Your personal fashion organizer 11