CADRE: Platform & Website

Creating the website and the platform gateway UI/UX of CADRE.

CADRE: Branding

Designing the visual identity for the CADRE project.


The social-credit-based micro-loan solution for Hong Kong Millennials.

Grantit is a Hong-Kong-based micro-loan service launched in 2018.

Our client reached out to us, Altitute Labs, with the vision of a social-credit-based micro-loan product.

I co-led the PD Sprint with Jacklyn Tsui, CEO of Altitude Labs, and I worked on the project as the main designer for major aspects such as system/information architecture and UI/visual design.

My Role

Hong Kong has a market for personal loans. To turn more people into borrowers, many companies have taken different attempts to simplify the loan application process. However, without groundbreaking changes, most of these "extra fast", "10-minute" or "purely online" processes were only bold claims and somehow fake advertisements.

Our client was interested in making the process actually faster with the help of data, technology, social network and smartphones.

Market Background

Project Duration: 3.5 months

Project Deliverables: Grantit App (MVP) + Grantit admin panel + Grantit back-end management system

02 Product Design Sprint

We borrowed the idea of Product Design Sprint from Google Venture and customized it to better suit our clients' needs. Our version of the PD Sprint consists of 7 stages:

01 Introduction

Stage 1: Understand

This is where our client opened her business vision and ideas up to us. As the designer in the team, I had our client filled out our pre-work sheet which consists of a list of questions regarding her vision from the perspectives of business, technology, operation, design and so on.

After getting on the same page, we created the problem statement:

02 Product Design Sprint

Stage 2: Diverge

Our client and members from our team, including myself, CEO Jacklyn Tsui and programmer Varun Vasudevan, spent the Diverge meeting session on UI ideation, sketching and primitive evaluation. Together with our client, we performed ideation activities and produced various UI sketches with our own vision to each part of the app respectively.

Stage 3: Converge

Converge is the stage where the team decides which UI ideas moves forward through 2 rounds of voting. To facilitate this stage, all sketches generated in the Diverge stage are gathered, grouped by which section of the user flow they are part of, are hung up against the wall, and participants are given stickers representing their preference and approval of the sketches. Participants circulate around the room silently without exchanging ideas, go through all and each sketch, and leave stickers on sketches they prefer for a reason. After the first voting round, each sketch is checked for stickers, and participants who gave stickers are required to articulate their choices. In the second voting round, the client is given another kind of stickers to vote and pick the designs that move on to the design stage.

Stage 4: Constrain

In the Constrain stage, we discussed required limitations for the entire system. For the consumer-facing app, limitations such as range for numeric fields, character limits for text boxes and procedural logic flows are outlined and specified; for the back end management system, possible roles of users and minimal necessary functionalities and written into the design proposal, subject to future design and development.

Stage 5: Design

Moving on into the Design stage, the first thing I did is to turn the selected sketches into digital ones.