UIUX · Branding · Web · Mobile
Fintech Startup Website
Rate, having rebranded itself and with 3 products in its lineup, the company’s website needed to reflect this brand new change.
Jan — Apr 2018 · 4 months

Background
Rate is a Singapore-based Fintech and Commerce startup. RateX and RateS are consumer facing products focusing on e-commerce, while Rate3 is a tokenisation protocol. In 2018, Rate joined the PayPal Innovation Lab

Role
I led the entire project from research, design to final development of the websites for Rate, RateX and RateS. I used Webflow to build all 3 sites— helping the company to reduce client efforts for development and maintenance; crucial for a fast-moving, young start-up.

My Process

Rebranding of Rate
Parallel to the website redesign, I also drove the rebranding efforts of Rate with TheUniverseFanatics

No items found.

Stakeholder interviews
To get a deeper understanding of the brand, I worked closely with the founding team and branding agency to craft our vision. This drove alignment while I gained a greater clarity for the purpose of our website.

Challenges
1. Visual alignment and consistency with Rate, RateX and RateS
2. Clear value proposition of each product
3. Prove credibility and trustworthiness

How might we effectively communicate the distinct product offerings while uniting it within the Rate ecosystem?

Site Map
I started with a site map to prioritise our key features and lay out the navigation patterns.

1. Rate website

Iterations and Testing

The use of real devices resonated with users

It establishes context and was immediately understood. Copy were tested to distill out the most relevant hooks while I experimented with our brand motifs across the site.

After validating the flow, I moved on to development on Webflow

2. RateX Website

Information Architecture
We identified that the timeliness of each information along a users' journey on our site was crucial. I created building blocks for each section and tested the hierarchy variations based on how users understood the product.

Categorise the content based on what our users are asking while navigating through the information.

No items found.

Other opportunities
1. Featuring various brand partnerships
2. Drive traffic to e-commerce sites
3. Share ratings or download metrics
4. Include social proof and user reviews

User testing
We observed how our users scroll and explain each point. Two key learnings;


Placing benefits on top fold was effective, while featuring partnerships at the end reassured users of our credibility.


Before-After — Hero Section
• Show product in context to draw connection
• Top fold features popular e-commerce sites to pique interest
• Brand alignment with Rate ecosystem

No items found.

Before-After — Brand partnerships
• Improve search for 200+ sites
• Arranged according to commonly searched categories (Travel, fashion, tech, beauty etc.)
• Reduce cognitive load

Before-After — How it works
• Expanded into a step-by-step tutorial
• More directive guidance
• Focus on users' journey with highest pain points (Payment, coupon and referrals)

No items found.

Final outcome
This is the final delivery for all 3 sites.
For RateS website, I applied the same learnings and logic from RateX.

Reflections
One of the most valuable lessons I learned while designing for Rate website: don't approach the design phase without first understanding the brand, product and company's vision.

Beyond surface awareness, but deep and empathetic understanding of the stakeholders

What could be better?
1. Pushing for brand and team alignment more aggressively.
We wasted alot of time reaching agreement. Communication could have been more effective had I plan a timeline to arrive at decisions while setting up more direct channels to communicate.

2. Validated RateS website before moving into development.
I made the rookie mistake of replicating learnings directly from RateX to RateS. Although both serve the same target users, they are on vastly different mediums.

Back to to the top ↑