Ottri — Product Designer

2025-2026

Website

Ottri is a lending platform that helps businesses offer financing to their customers. It makes the whole process easier, from applying for a loan to getting approved and funded.

Client view

The Client View is a link businesses send to their customers. Customers use it to enter their information and apply for financing.

  • The client link on a phone under the business's own logo: a loan amount slider set to $40,000, preset amounts beneath it and a note that checking eligibility won't affect the credit score
  • The next step of the same link: a form asking for name, email, home address and date of birth
  • The loan options step: the heading “You Are Pre-Approved For $50,000” and a selected option with its monthly payment, loan type, APR and term

In the end, the customer sees a success screen confirming that their application has been submitted.

The closing screen: a check mark, the heading “Loan Is Approved!” and a card with the approved $50,000 over 15 months, the APR and the monthly payment

Custom colors

Businesses can customize the look of their client links, including colors. Along with preset options, I wanted to give them the ability to use their own primary color. The challenge was making sure the interface stayed readable with any color they chose.

To solve this, I used a token-based approach. When a user enters a primary color, the system automatically generates a palette based on it. Each UI element uses a specific token from this palette. For example, primary buttons use the 700 token to ensure they always stay readable.

Shades generated from a single orange, stacked from lightest to darkest and labelled 100 to 500 with their hex values
The palette is generated using the UI Colors API, which works both in Figma and in code

As a result, businesses gained more freedom to customize their client links with colors while keeping the process simple.

  • The pre-approval step of the client link in a crimson brand colour: the chosen loan option is outlined and its button filled in the same colour
  • The same pre-approval step in an orange brand colour, with every accent following the new palette
  • The same pre-approval step in a blue brand colour, under a different business's logo

Settings

I also designed both personal and admin settings, covering everything from individual preferences to business information, team management, roles, services, and branding.

Business owners can easily manage their teams by inviting employees, assigning roles, and creating custom roles with different permissions.

Branding settings let businesses customize the client experience with their own logo and brand color, with previews for both desktop and mobile.

Profile settings let users manage personal information, update their avatar and phone number, and control security and notification preferences.