GEMS
Sign-up page
I’m currently freelancing for Gems, a private alpha startup as a product designer since Mar 2024. The co-founders requested for a redesign of their signup page. In 1 week, I delivered a MVP and MLP version and worked together to come up with the final product.
Duration
Mar 2024
Role
Product Designer
Tools
Figma, Figjam
Team members
Sandy Jiang (Co-founder of Gems)
Bilva Sanaba (Co-founder of Gems)
PROBLEM
Business’ perspective
Gems’ goal is to create a space for people to share the things they do off-line that’s less saturated by only visual focused content.
👉 However, Gems struggled to modernize their UI.
SOLUTION
I worked with one of Gems’ co-founders to create a signup page for them and help them begin to elevate their UI.
🚀 The signup page was built in 2 weeks and ready to be used: https://www.trygems.xyz/welcome
Design Decision 1: Less fields is better
In line with standard design principles, minimizing user clicks and number of inputs boosts sign-up rates. Therefore, I opted to only include essential fields for unique identification. In this case, it was the email field. Through competitive research, I found that majority of products also only request email addresses for new launches.
Design Decision 2: Side by side is better
While iterating on layouts, I explored split-screen versus full-page views. In mid-fidelity mockups, the side-by-side option proved advantageous for Gems to market their product and brand. While more work to make it responsive, the side-by-side layout adapts well as the right side content can move down or disappear.
Design Decision 3: Using banner for lists
Recognizing the extensive bullet lists that Gems uses and observing a trend of banners in modern UI during competitive analysis, I combined these insights. I designed two banners at varying speeds to demonstrate the diverse scenarios of Gems and boost visual attractiveness.
PROCESS
While following the standard design process, I’d like to call-out 2 major steps I did to move the project forward:
Analyzing current experience & competitors
Knowing the ins and outs of the current experience helps me understand what works well vs. what doesn’t. It also prepares me to know how we stand compared to current competitors.
During competitive analysis, I focus on how other companies layout their signup pages and how they go about making these pages responsive and adaptive. This helps me to understand current standards and the pros and cons of each potential approach.
Present 2 solutions: MVP & MLP
After I iterated and narrowed down my solutions, I created 2 high-fidelity wireframes to present to the cofounders. One was a Minimal Viable Product (MVP) version and the other was a Most Lovable Product (MLP), along with my design decisions & reasons.
Doing so encouraged the cofounders and me to collaborate. Together, we came up with the final product.
IMPACT
Testimony from one of the Co-founders:
“Anny was such a joy to work with on our landing page project. She elevated our simple sign-up page into one that sparks joy and gets our message across. We’re excited to keep collaborating with her!”
LEARNINGS
As this was my first experience consulting for a company, I learned a lot about my process and understanding what parts of the process I wanted to partake in and what aspects I knew were unnecessary and could be skipped.
🥰 I loved adding delight & joy to this platform by experimenting with typefaces, gradients, and fun UI experiences.