uno. refi

uno. refi

UI/UX Design for an online mortgage broker that help Australians win home loans through smart technology.

Services

UI/UX Design  ·  Mobile Web

Durations

2  Weeks

Date

Jul 2018

uno mobile web iterate process

The challenge

The challenge

74% of Australians don't bother refinancing their loan because of how much effort it takes. uno challenged us to simplify a complex refinancing process into an intuitive mobile experience that scale and avoids an hour of legwork & hassle filling out forms.

We helped uno robust their mobile web experience and simplify a refinance process to around 10 minutes of effort

We helped uno robust their mobile web experience and simplify a refinance process to around 10 minutes of effort

uno design process
uno-research-process

Our approach

Our approach

We get started our baseline evaluation by study uno exiting branding, style guide and user interview.

uno also provide us with their rough UI components and different variations of user journey/flow (initial concept).

We take off from initial concept and develop a quick idea on top of the typical pattern and align our new foundation into the design system to fast forward the screen design part.

uno styleguide 01

Official styleguide from uno.

uno styleguide 02

User interview provided by uno + our internal interview.

Quick Ideas

Quick Ideas

Initial pattern from the new design foundation

div
uno-basic-components@2x

Design Foundation

Design Foundation

Modularity Atomic Design approach (Atoms, Molecules and Organisms) with 8pt Google Material Design Grid System as the go-to source of truth.

uno-Design-Foundation@2x

Designed for interruption

Designed for interruption

Pre-questions is the first experience (even before login or create an account). We help people reduce friction from a complex refinance task with the "Parallel UI Design" (rather than "Linear UI Design").

We allow the user to layer gestures at the speed of thought and interrupt the flow if needed.

Before we jump into the design context, here is what does it mean:

1.  Linear UI Design — Gesture happens after thought

Thought  Decision  Gesture  Release

2.  Parallel UI Design — Gesture happens with thought

[Thought + Gesture]    [Decision + Release]

uno flow idea A

Linear UI Design

uno flow idea B

Parallel UI Design

Parallel UI in Design Context

“Fantastic work! I just walked the squad through all of your designs, animations and flows and everyone’s pumped to start building it!”

"Fantastic work! I just walked the squad through all of your designs, animations and flows and everyone's pumped to start building it!"

Mobile Web Design

Mobile Web Design

Selected experiences, screen and patterns (not in-order)

uno refinance mobile web
uno refi selected screen 02
uno refi selected screen 03
uno refi selected screen 04
uno refi selected screen 05

Rapid Prototyping

Rapid Prototyping

Tools that help the team making a decision fast

“Epic! Super pumped to see all this live and the impact it's going to have!”

Epic! Super pumped to see all this live and the impact it's going to have!

—Vincent Turner, CIO & Founder at Uno home loans

Scope of work

Scope of work

Discover & Strategy

  • Baseline Evaluation
  • Research
  • Experience Strategy
  • Information Architecture

Product Design (UX/UI)

  • User Flow Mapping
  • UI Design & Prototyping
  • Visual Design
  • Design System & Foundation
uno refinance mobile web

I was lucky enough to work with Kocha on a recent project with uno Home Loans. We had tight deadlines and a rather ambitious end-to-end design review of an existing mobile app. And yet, Kocha was able to over deliver and delight us with his final solution.

Along with his insightful design thinking and beautifully crafted designs, Kocha also brought an incredible passion and energy to the project. He kept us well informed on progress and shared his ideas early so we could iterate together and ultimately arrive at the best solution.

It’s hard to articulate exactly… but there’s an attention to detail in every question Kocha asked and every interaction we had along the project’s journey… not to mention every artefact he delivered. Just a delight to work with and I'm looking forward to working with him again in the future.

I was lucky enough to work with Kocha on a recent project with uno Home Loans. We had tight deadlines and a rather ambitious end-to-end design review of an existing mobile app. And yet, Kocha was able to over deliver and delight us with his final solution.

Along with his insightful design thinking and beautifully crafted designs, Kocha also brought an incredible passion and energy to the project. He kept us well informed on progress and shared his ideas early so we could iterate together and ultimately arrive at the best solution.

It’s hard to articulate exactly… but there’s an attention to detail in every question Kocha asked and every interaction we had along the project’s journey… not to mention every artefact he delivered. Just a delight to work with and I'm looking forward to working with him again in the future.

Product Lead

uno home loans (Sydney)

Team

Vincent Turner
Andy Coffey
Kocha Worapon

Next project

Next project

Freelancer Portfolio Cover

Freelancer timeline

New flagship experience design for a global crowdsourcing marketplace company used by 25+ million people.

© 2019—Kocha Studio  ·  Privacy

Kocha's Twitter     Kocha's Medium     Kocha's Linkedin     Kocha's Dribbble

Get in touch

220 Pacific Hwy
Crows Nest NSW 2065

What can we do for you? Let’s us know