Urban Shield

View Live Website

The project's core focus revolves around elevating the user journey when acquiring custom phone cases by establishing an intuitive and streamlined experience. Acknowledging the prevalent hurdles users encounter while navigating through the customization landscape and seeking phone cases online, the primary objective was to streamline this journey. The aim was to furnish a platform that effortlessly allows users to articulate their personality through seamless customization.

Delving into our collective experiences, we observed that while purchasing phone cases is a common activity, the ease and seamlessness of this process vary significantly. Consequently, our focus was on developing a streamlined and intuitive flow that seamlessly facilitates users in purchasing their custom phone cases. This approach prioritizes users' preferences and requirements, ensuring a hassle-free and personalized experience.

User Research Approach:

A moderated usability study engaged five participants, inclusive of 2 males, 2 females, and 1 non-binary individual, spanning ages 18 to 50, with one participant affected by hand deficiency. This in-person study allocated specific tasks, each to be completed within a 40-minute timeframe. Subsequent qualitative interviews, conducted by the moderator, yielded invaluable insights into user experiences and identified pain points.

We identified two different user personas:

Betty Schulz, an interior designer and mom who needs a sturdy and practical phone case because she must have her hands free and also protect her phone.

Logan Ross, a young college student who needs a cool and inexpensive phone case suitable for his phone, because he wants to protect it while influencing his friends.

The project started with digital wireframes:

These digital wireframes derive from the paper ones and became the low-fi prototype of the project.

These wireframes later evolved into mockups:

After conducting usability studies, the wireframes were reviewed and the design improved into mockups that match the users’ needs and requests, so that the product could work without any issues. In this hi-fi prototype the sections are clearer, the colours vibrant and the buttons are the right size.

Key Insights and Pain Points:
  1. Small Icons Navigability: Users encountered challenges navigating due to small icon sizes, impeding seamless interaction.
  2. Unclear Section Delineation: Participants expressed frustration over ambiguous platform sections, impacting navigation and leading to a sense of disorientation.
  3. Oversized Buttons Impact: Users felt overwhelmed by disproportionately large buttons, negatively affecting navigation.
Solutions Implemented:

The findings highlighted the significance of prioritizing user needs, particularly emphasizing the need for increased icon visibility, clearer section delineation, and appropriately sized buttons. These insights serve as guiding beacons, signaling opportunities for enhancement and refinement within the platform's design and functionality. These solutions were implemented to improve the user experience:

  1. Bigger Icons: Increased size for icons and enhanced visibility were necessary to facilitate easier navigation.
  2. Clearer Sections: Emphasizing the necessity for clearer delineation and user-friendly sectioning.
  3. Reduction in button size: this modification was well needed to achieve a more balanced and intuitive user interface.

By elevating the platform's usability, we aim to bridge the gap between user preferences and the customization process, ensuring a seamless and gratifying journey for every user.

Before and after usability studies:

The implemented changes are now evident.

  • The icons are larger and positioned more intuitively for users, ensuring smoother navigation throughout the order completion process.
  • Sections have been created using dividers and white space, effectively guiding the user's eye and establishing user-friendly segments.
  • the size of the buttons and texts, previously overly large and overwhelming, have been reduced to provide a more pleasant and balanced visual experience.
  • The vibrant colours make the interface modern and playful, creating an enjoyable user experience that encourages immersion in customisation, resembling a playful game.

Key Takeaways and Conclusions:

This project reiterates the pivotal role of user-centric design and iterative improvement in shaping a product that resonates with users' desires, underscoring the importance of addressing market gaps essential for users' satisfaction. The takeaway isn't merely about rectifying flaws but about embracing user feedback as a catalyst for innovation and enhancement. Through continuous iteration and a commitment to addressing user needs, we aspire to create a platform that provides an avenue for self-expression, creativity, and affordability valuable to users seeking representation of their personality in an everyday item.

Moving forward, we remain dedicated to implementing these insights.