A convenient outfit planner
A client from the UAE approached us for the design and development of the MyWard app. The idea of the app is based on her personal experience. The client needed a convenient app to combine different clothing items and create stylish outfits.
The potential app should work like this:
Users:
-
- register and create accounts;
- create an outfit and save the results in their digital wardrobe;
- share their outfits with others;
- see each other’s outfit ideas and subscribe to accounts they like.
There were some similar solutions in the market. However, they all had an important disadvantage: the clothing and accessories in those solutions were added to the app from stock photos or random websites rather than from catalogs of real stores. Users could only create exemplary outfits but couldn’t purchase those specific items or add elements from their own wardrobe.
MyWard solves this problem by featuring clothing from real stores like H&M or Zara.
This allows users both to create an outfit and immediately order it, using a link provided in the description of each clothing item. Alternatively, users can make a digital version of their wardrobe to check if new clothes match the old ones. Users just need to find their own clothes in the app and add them to their accounts.
With other apps | With MyWard | |
Users combine clothes and create outfits | ✅ | ✅ |
Users find clothes to buy from real shops | ❌ | ✅ |
Users create a digital version of their wardrobe | ❌ | ✅ |
Users order clothes from real shops | ❌ | ✅ |
Why don’t other apps borrow clothing items directly from store websites? It’s just more complicated and requires additional effort and time.
With MyWard, there’s no need to waste time picking out clothes at the store and creating outfits in a fitting room. You can easily do it online and save the entire outfit in the app while getting home or staying in line at the grocery store.
Sounds great, doesn’t it? To bring the MyWard app idea to life, we needed to:
1️⃣ Design a user-friendly interface that would appeal to the target audience (mostly, young girls), while finding a balance between premium minimalism and lively details.
2️⃣ Then, develop an app where users can create outfits, share them, and browse other users’ outfits.
3️⃣ During the development process, collaborate with the client’s team responsible for transferring items from catalogs of real stores into the app.
How we helped determine the MVP feature set
Unfortunately, our client lacked experience in creating mobile apps and launching MVPs. Fortunately, she had a fantastic idea, finances, and our team.
We needed to create a fully functional product and help launch it within tight deadlines to prevent competitors from doing it first.
It wasn’t just about designing and developing an app. We needed to work on its business logic and user experience and determine an MVP feature set.
We’ve already successfully launched over 300 MVPs for our clients, so we were working on MyWard according to a proven plan. After a detailed discussion of the app’s business logic, we suggested testing the idea and launching an MVP with a basic set of features. Together with the client, we chose the most important ones:
-
- Creating outfits by combining multiple clothing items.
- Viewing clothing items separately.
- Feed showcasing other users’ ideas.
- Portfolio of created outfits.
We decided to exclude the wardrobe analysis feature to release the MVP as soon as possible. Also, it helped to reduce the client’s expenses before the idea proved its profitability.
Thanks to our flexible approach and client engagement, we quickly developed a clear task list and realistic project deadlines.
How we helped to find the app’s unique style
We started working on the design by analyzing the references provided by the client. She didn’t have specific ideas but rather preferences and a general vision. We analyzed the given examples and established approximate guidelines:
NO❌ | YES✅ |
Too serious style of icons | Minimalism |
Too playful style of icons | Eye-catching buttons |
Saturated colors | High-contrast combinations |
Cold accent color | Pastel-colored background |
Bright pink and red | Smooth shapes |
After 3 months of working with us, the client got a design that fully matched her vision. It was ‘that’ particular style for the MyWard app that would appeal to users and be comfortable for browsing and creating outfits.
Let’s have a look at the exact examples:
1️⃣ We created a minimalist black-and-white interface with orange accents. This way, the screen doesn’t seem cluttered despite the various colored clothing elements on it.
2️⃣ For the interface, we chose light colors as they are excellent for viewing images. The light blue background complements the white panels with images. The orange adds warmth and coziness to the interface, while the dark buttons provide contrast and set a more serious mood.
3️⃣ We chose minimalist icons to ensure that the users focus on viewing outfits and interface elements don’t distract them.
4️⃣ We provided two viewing options for outfits in the feed: one by one or in a grid. The user can choose whether to view several outfits at once or focus on a specific one.
5️⃣ We chose two fonts: an eye-catching font for headlines and a more restrained one for the rest of the text.
6️⃣ We added a cover and portfolio display in the personal profile so that users can quickly assess the style of the profile owner and subscribe if desired.
Our successful collaboration with the client’s team
While developing MyWard, we collaborated with the client’s team. They were responsible for transferring clothing items from catalogs of real stores and developing a neural network to remove the background from clothing photos.
We’ve already worked on projects in collaboration with the client’s team. In the case of MyWard, we managed to work seamlessly as well.
To achieve this, we figured out how to transfer clothing item lists into our application so that they are conveniently arranged when creating outfits.
We also noticed that the neural network developed by the second team didn’t completely remove the background from clothing photos. This wasn’t really convenient when combining different clothing items. The remaining parts of the background made the overall picture look untidy. It took some time to find a solution, but it worked out. Now, clothing items are accurately separated from the background, allowing users to create stylish outfits easily.
How we developed a landing page
In addition to the app itself, we also worked on a landing page for its promotion:
-
- We chose a similar color scheme but with slightly warmer tones to create a friendly and inviting atmosphere for potential users.
- Added only necessary elements: there’s convenient navigation at the top of the page and buttons for quick downloading in the center of the first screen.
- Further down the landing page, there’s a presentation of the advantages and an interactive screen showcasing the application’s functionality.
We delivered the project on time
The client was greatly satisfied with the result and appreciated how clearly and enthusiastically we worked to achieve it. It took 10 months from the first contact to the final project delivery. In the end, our client released a functional MVP app with a paid premium subscription.
Now, the client is collecting feedback and gathering suggestions from users for new features and improvements to the ones already implemented. After collecting this information, we plan to continue collaboration and discuss the further development of an extended version of MyWard.
[wpim]