Member Site Promotional System Redesign
Promotional Design - Why This Work?
Promotional design refers to the strategic planning and implementation of visual and informational elements to effectively convey messages and encourage desired actions among the target audience.
For the membership site in this project, the promotion system includes alerts, notifications, and promotional content. Promotional design is critical to how the site displays and stores these components and how it fosters CTAs.
How might we…
… create an intuitive, retrievable, and user-friendly notification system?
… send targeted and content specific promotions to specific lines of business?
… design notifications to minimize visual information overload and clutter?
Role
UX Designer / UI Designer / User Researcher
Duration
Jun 2023 - Aug 2023
Main Practices
UI UX Design / Prototyping / Usability Testing
Understand & Define
First, I tried to analyze and define the main components and characteristics of the current extension system, in order to have a clear understanding of the design objectives.
Break down promotional design in 3 categories:
Alert
Notification
Promotion
Define attributes for each category:
Color
Tone
Feature & Rules
Ideation & Prototype
Based on my understanding of the promotional system, I ideated some low-to-medium fidelity prototypes to explore their visual appearance in real screens. The following prototypes helped me conceptualize user engagement and interaction, brought me an initial but comprehensive view of the design, and provided a proper iteration for sufficient and detailed feedback.
Banners
Notification icon
Promotions in mega navigation menu
Design Review
Next, I present the prototype with the cross-functional teams to gather feedback from different perspectives. The design review helped me generate new questions, and get clarified on the direction for refinement.
High-Fidelity Prototype
Alert Icon & Pop-up
Display Multiple Alerts
Support Alert Retrieval
Take Less Space in Collapsed State
Mega-Nav Menu Promotions
Page-Specific Promotions
Carousel Design for Multiple Promotions
Usually Hidden - Less Distraction During Browsing
Usability Testing
Tool:
UserZoom
Demographics:
218 general participants
The testing result helped me validate decisions, uncover imperfections in layout, and interactions, and discover opportunities to enhance the design.
Next Steps
Launch the remaining promotional usability tests
Gather and analyze test result
Finalize the design based on user feedback
Development handoff by the end of September 2023