Selected Case Study

CASETiFY:
Unlock the best limited-edition collaborations

Shop and waitlist exclusive co-labs in your pocket.

Designed and co-owned the product – CASETiFY Colab from scratch, I oversaw the product lifecycle to monitor the quality of outputs from design, development, launch to maintenance.

Collaborated with cross-functional teams, I spearheaded its growth and product design strategies aligning with business and user requirements utilising UX research and UX/UI design.

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of CASETiFY.

Scroll to view what I did

Drive the growth.

Aligned business goals, visions and requirements.

In spearheading the product design, I held discussions with the Head of E-commerce and the conclusion was that our core focus revolves around achieving three key objectives:

  1. Expand market presence and ecosystem of co-lab sector.

  2. Minimise marketing cost on retaining co-lab buyers.

  3. Customise campaigns and activations for co-lab buyers.

Conversion%

34
%
higher on new build

CASETiFY Colab strategically promoted app-exclusive collections and offers to incentivise users leading to rapid uplift in conversion rate.

Retention%

46
%
lower than benchmark*

CASETiFY Colab constantly sent time-sensitive and relevant push notifications to engage users leading to significant uplift in retention rate.

Remarketing Cost

82
%
higher on new build

CASETiFY Colab effectively utilised in-app features to retain users and optimise ad budget leading to reduction in re-marketing cost.

*Exact number of growth metrics are confidential and have been hidden.

Scroll to view how I did

UX research comes first.

Defined and managed full product design cycle.

As the UX/UI Lead, I oversaw end-to-end lifecycle to ensure quality deliverables, monitored design, development, and launch phases as well as conducted A/B testing for performance insights.

In the meantime, I also measured user engagement and feedback, maintained product for continuous improvement, iterated based on data-driven decisions as well as aligned processes with project goals.

Iterate
Research
Design
Development
Test

Investigate what users think.

User interviews and surveys were conducted to collect direct user feedback to inform design, understand user needs, behaviours, and motivations and to identify pain points and areas for improvement.

To understand users’ performance on goal conversion on web.

To understand users’ performance on being retained on web.

Knew what users prefer.

User focus groups and workshops were held to gather diverse user insights and perspectives, validate design concepts through real user feedback and to foster collaborative ideation and problem-solving.

Discovered what market does.

Competitive analysis were conducted to identify industry trends and best practices, benchmark against competitors to find opportunities, uncover strengths and weaknesses of rival products as well as to inform strategic design and development choices.

Researches were conducted to understand the compatibility and preference of device, browser and OS.

Researches were conducted o understand accessibility barriers and concerns for compliance and usability.

Validated what users struggle.

Behaviour analysis were conducted to analyse user interactions, identify patterns, preferences, and pain points as well as to inform UX improvements for enhanced usability with the help of heat maps, scroll maps and tracking.

In the meantime, they could also optimise conversion rates and user engagement, drive data-driven design decisions for optimal user experiences as well as to enhance user journey comprehension and refinement.

Consolidated what users need.

User experience map was concluded to visualise user journeys and touchpoints holistically, identify pain points and moments of delight, inform design decisions with user insights as well as to foster empathy and understanding of user needs.

Analysed findings and determined product strategy.

3 major insights are concluded as below based on the findings analysed from above UX researches conducted and the best product strategy is hence determined to meet business and user needs:

  1. Participants spent 30%+ time on shopping in apps over webs and 90%+ of them are iPhone users.

  2. 70%+ of participants retained with personalised push notifications and real-time updates in apps.

  3. 80%+ of participants engaged more with apps with app-only features for exclusivity and loyalty .

Product Strategy

iOS Mobile Application

  • Dedicated ecosystem for majority of iPhone shoppers

  • Effective re-marketing utilising time-sensitive notifications

  • Support of exclusive content and offers such as priority access

Then UX ideation ...

Aligned project goals.

Goal alignment was performed to align UX decisions with overarching business objectives, ensure user needs are met as well as to balance user satisfaction with business success, profitability and growth.

Prioritised product features.

Product roadmap was defined to outline project milestones and timelines, align team efforts towards common goals as well as to prioritise feature development and enhancements.

Interpreted target audiences.

User personas were created to understand target audience needs and behaviours, humanise user demographics for empathy as well as to guide design decisions based on user goals.

In the mean time, they could also align team understanding of user segments, enhance user-centered design approach, improve product relevance and usability as well as to inform marketing and communication strategies.

Organised product structure.

Information architectures were utilised to organise content logically for intuitive navigation, prioritise user needs and tasks as well as to ensure scalability and adaptability.

Illustrated software layouts.

Wireframes were created to define layout and structure early in design, establish functionality and content hierarchy as well as to gather stakeholder and user feedback efficiently.

Outlined user journeys.

User flow and task flows were applied to streamline user interactions to enhance app usability as well as to identify and prioritise key user tasks for efficient navigation.

In the mean time, user flow and task flows could also ensure seamless transitions between app screens for intuitive browsing while optimising flow to minimise user effort and maximise engagement.

... and UI design.

Stimulated product user flows.

Prototypes were created to validate design concepts through interactive simulations, gather user feedback to refine functionality, identify usability issues early in development demonstrate user flows for stakeholder approval as well as to ensure alignment with user needs and expectations.

SVGs were manipulated to enhance graphics scalability and to ptimize performance with lightweight vectors.

Icongraphy was designed to allow users to collect and customise app icon from brand co-lab releases.

Enhanced content readability.

Typography was designed to ensure readability across various devices, maintain brand consistency with font choices as well as to enhance visual hierarchy and user flow.

Reinforced brand identity.

Colour palettes were crafted to ensure brand consistency with selected hues, enhance visual appeal and engagement as well as to improve user experience through intuitive colour coding.

--color-brand-blue
44 93 71 2C5DAB 217 74 67
--color-brand-lilac
228 192 211 E4C0D3 328 16 89
--color-brand-red
230 23 23 E61717 0 90 90
--color-brand-yellow
245 225 99 F6E163 51 60 96
--color-brand-pink
246 161 155 F6A19B 4 37 96
--color-brand-green
33 166 100 21A664 150 80 65
--color-system-success
40 167 69 28A745 134 76 65
--color-system-danger
220 53 69 DC3545 354 76 86
--color-brand-red
230 23 23 E61717 0 90 90
--color-black-60
102 102 102 666666 0 0 40
--color-black-45
140 140 140 8C8C8C 0 0 55
--color-black-30
178 178 178 B2B2B2 0 0 70

Unified element placements.

Grid and spacing scheme was defined to ensure layout consistency across screens, optimise alignment for visual harmony as well as to enhance readability with balanced spacing.

Indentation
Level 1 15px from screen boundaries — everything except full-width elements places within.
Level 2 30px from screen boundaries — usability-optimised indent for essential elements.
Level 3 45px from screen boundaries — innermost, additional indent for content within content.
Margin
Margin Field Space determines the proximity to other outside elements.
px
Margin Value In “pixel” unit for device throughout different screen sizes.
Padding
Padding Field Space around the content which expands from itself.
px
Padding Value In “pixel” unit for device throughout different screen sizes.

Ensured visual consistency.

Design system was created to ensure visual consistency by defining reusable components, enhance design efficiency through a structured system as well as to promote scalability with adaptable elements.

Visualised design concepts.

Mockups were designed to visualise design concepts clearly for stakeholders, identify and resolve potential issues early as well as to facilitate user feedback with realistic representations.

Drew focus to importance.

Animations, transitions and interactions were applied to enhance user engagement with fluid interactions, guide users smoothly through the interface as well as to provide visual feedback for actions.

In the mean time, they could also improve overall aesthetic appeal, ensure seamless transitions between app elements, maintain consistency in motion design language as well as to highlight key actions and elements effectively.

Test. Observe. Measure.

Evaluated product efficiency.

Usability testings were conducted to gather insights to enhance user experience, identify pain points and areas for improvement as well as to validate design decisions with real users.

Measured, optimised product success.

Conversion rate optimisations (CRO) were carried out to increase user engagement and conversion, identify and address barriers to conversion, optimise user journeys for higher conversion rates as well as to enhance call-to-action effectiveness.

Tracking was embedded to understand user behaviour, identify pain points and measure product effectiveness.

A/B testings were carried out to validated design hypotheses through iterative design improvements.

Scroll to view final outcome

A quick look.

Join us in enjoying app-only content and offers.

As the UX/UI Lead for the CASETiFY iOS app, I oversee the development of a seamless shopping experience. From browsing to waitlisting collaborations, our focus is on user engagement and functionality.

By crafting intuitive interfaces and optimising user flows, we aim to create an immersive app that meets the needs and expectations of our customers.

Social
Reset Password

Splash screen.

The Splash Screen feature welcomes users to the app with an engaging and visually captivating introductory interface.

Navigation.

The Navigation feature ensures seamless user experience by providing intuitive and efficient ways to explore app features.

Waitlist and shop.

The Waitlist feature enables users to join exclusive collaboration queues, enhancing their access to limited-edition products.

Stories.

The Stories feature immerses users in captivating narratives, showcasing product highlights in an engaging format.

Cart.

The Cart feature provides a seamless and convenient way for users to manage their selected items for purchase.

Profile.

The Profile feature allows users to manage their personal information and preferences, enhancing personalised shopping experience.

Order.

The Order History feature empowers users to effortlessly track and review their previous purchases in detail.

Sign up.

The Sign Up feature enables seamless user onboarding, ensuring a smooth and efficient account creation process.

Log in.

The Login feature ensures secure access for users, enabling seamless authentication and account utilissation.

Forgot password.

The Forgot Password feature allows users to easily regain access to their accounts through a streamlined process.

Settings.

The Settings feature empowers users to personalise their experience effortlessly, tailoring app settings to their preferences.

Account.

The Account feature provides users with a central hub to manage their personal information and preferences.

Address.

The Address feature allows users to manage and update their shipping addresses effortlessly for seamless order processing.

Notifications.

The Notifications feature enables users to customise their notification settings according to their preferences and needs.

Support.

The Support feature provides users with comprehensive support resources and assistance to address their inquiries.

About.

The About feature provides a review and informative introduction to the company along with relevant documentations.

Language.

The Language feature enables users to choose their preferred language for an enhanced app experience for localisation purpose.

Log out.

The Log Out feature allows users to securely log out, end their session for enhanced privacy or switch to other accounts.

Deep link.

The Deep Link feature enables users to access specific app content directly through deep linking functionality on the website.

404.

The Error Page feature elegantly handles and communicates the occurrence of a 404 page not found error.

Teamwork.

Bijoi exhibited an incredible mastery of product ownership and UX/UI design throughout the entire process, transforming business challenges into elegant solutions. His attention to detail has truly brought the app to life.”

Next Project. 

CASETiFY Club

.