Redesign dUCk App, elevating shopping experience and transform brand perceptions

dUCk is a prominent modest wear brand known for its elegant and contemporary designs. With a focus on offering stylish and modest clothing options, dUCk has gained a strong following in the fashion industry. The brand is recognized for its commitment to quality, patterns and prints, and a wide range of modest wear, including scarves, clothing, and accessories, catering to diverse tastes and preferences

Our Objectives

The dUCk App serves as a cornerstone for dUCkies (our loyal customers), offering exclusive App-only deals. However, it's time for a significant overhaul. We aim to redesign the dUCk App, not just as an exclusive sales channel, but as a dynamic platform that delivers value to users. Our objective Enhance the shopping experience with up-to-date features Convert new users into loyal customers by fostering user engagement and enabling targeted e-commerce marketing efforts.

1. Enhance the shopping experience with up-to-date features
2. Convert new users into loyal customers by fostering user engagement and enabling targeted e-commerce marketing efforts.

Defining what matters
We conducted extensive research using a combination of quantitative and qualitative methodologies, aligning our efforts with both user needs and key business requirements. This collaborative approach involved close collaboration with key stakeholders from the e-commerce team who provided valuable insights into how our redesign could facilitate their marketing efforts.


We began by consolidating and analysing data from Google Analytics and heat maps to gain insights into user behaviour patterns.


Usability testing was a crucial part of our research, allowing us to capture qualitative data from both new and existing users. This process helped identify in-depth pain points, and usability issues.


As we delved deeper into our research, we segmented user groups, further explored their pain points, and conducted UI testing to identify accessibility challenges. This comprehensive approach enabled us to map out the user journey, highlighting both pain points and opportunities for improvement.


Additionally, we conducted competitive analysis to stay informed about current market trends and ensure that our redesign would align with industry standards."
Heatmap, GA, qualitative, and quantitative research were conducted.
Key findings
1. Limited User Engagement: A significant portion of users never progressed beyond the initial section of the home screen. This issue stemmed from infrequent content updates and a less engaging design in other sections.

2. Outdated Design and UI: The existing app design had become outdated, and the presence of bugs hindered the overall user experience.

3. e-Commerce Bottlenecks: The existing design and backend constraints were limiting the full potential of our marketing initiatives.
‍
4. Logistical Hurdles: The project faced logistical challenges, including a tight timeline and resource constraints. With just two designers, the workload became particularly demanding.
Strategy
Prioritize enhancing the 'Explore' and 'Consideration' stages of the user journey to increase user engagement and session durations on screens like Home and PLP. Additionally, improve conversion rates on the PDP. This prioritization caters to both new and existing users, delivering an improved overall experience.
Design Process
We decided to start from scratch, revisiting design tokens. While this may have raised eyebrows among the development team, we recognized the unique opportunity to refresh the entire platform.

We cataloged an extensive feature wishlist, which we organized into manageable phases. Daily stand-ups ensured iterative prototyping, ultimately culminating in clickable prototypes.

These prototypes covered exploration to consideration, with later stages focused on actions post "add to cart." After thorough testing and validation, we presented our prototypes to stakeholders.
The Design
First, we placed a strong emphasis on visual imagery, including images and videos, as this aligns with the hallmark of high-end fashion brands that prioritize aesthetics.
Simplified and streamlined component variations that didn't add value, thus reducing cognitive load.
New components were introduced to cater to the unique needs of both new and existing users.
We considered the resource constraints related to constant banner changes and implemented features like the content carousel. This feature eases the workload for content creation by allowing us to reuse existing content assets. Additionally, it provides high value to our existing users by enabling swift access to the latest sales and promotions, enticing users to return for more content consumption.
User-centered features like grid view and swipe-able thumbnails were integrated.

Optimized product cards, harmonizing media sizes and aspect ratios, streamlining workflows for our content department.

Quick-add for shoppers and color indicators for easy color reference.
Swipe gestures to view other image were introduced, accommodating users who wants a quick view.
Significant PDP redesign with added gesture interactions: swipe up or down on the top 70% of the screen to browse images, and swipe left or right to navigate to the next product in the same collection, eliminating the need to return to PLP. It was optimized to encourage consideration, increase conversions, and empower users to explore further.
The product details section aims to strike a balance by providing bite-sized information without overwhelming users.

In our new design system, we've also refreshed the spacing system. You can adjust X to your preferred padding value, and we've added an extra 20px for improved readability and segmentation.
New Search screen to consolidate user search task, such as search products, search stores,
We introduced a new Menu Screen with a fresh UI and borderless thumbnails. This change was made because our content or e-commerce team may not always have the ideal images. Some images may have busy backgrounds, which, when stacked in rows, can look cluttered and overwhelm category clarity.

To efficiently organize categories, we integrated both list and grid views and established specific conditions to determine when to employ each, based on the strategy aimed at maximizing visibility and user experience.
Lastly, dark mode was thoughtfully designed, incorporating a unique color palette to enhance reading and accessibility while reflecting the brand's essence.
As the project is still in development, a definitive impact assessment is pending. Overall feedback from testers has been overwhelmingly positive, with many expressing excitement about the new features and enhancements. Embarking on a redesign from a clean slate can be challenging but ultimately rewarding. It allowed us to address long-standing
🙌
15
WOW!
Out of 17 testers
🤯
2
Designers
Me & Mr Abid
View all works
Next work