Loon Canada: fintech website and UI/UX design for Canadian startups

Loon Canada is the Canadian edition of our US business-banking case study. It keeps the structure and the design system, then changes what matters for Canadian founders: Canadian spelling, CAD pricing before tax, CDIC deposit insurance, CRA and Business Number references, and a compliance layer built around PIPEDA, Quebec Law 25 and CASL.

Project facts

• Client: Loon Inc. (fictional)
• Sector: Fintech · B2B banking · SaaS
• Markets: Toronto and Vancouver studios; Canadian startups from pre-incorporation to Series C
• Services: Market localisation · Copywriting · Brand adaptation · Fintech website design · Accessibility (WCAG 2.2 AA) · SEO foundations
• Templates: 10 page templates shared with every Loon edition
• Stack: Hand-built HTML, CSS and vanilla JavaScript; one strings file and one theme file per market

The brief

Close to the US, but unmistakably Canadian

Canada shares a border and a banking vocabulary with the US, but a Canadian fintech site has to speak Canadian English and Canadian compliance. The en-CA edition starts from the US build and applies Canadian spelling (-our, -re, -ize, cheque, licence as a noun), swaps US institutions for Canadian ones (CDIC for FDIC, CRA for IRS, OSC/CSA for SEC, SIN for Social Security number), and shows every price in CAD before tax with GST/HST (+PST/QST where applicable) added at checkout. The tone is friendlier and less salesy than the US copy, and the legal layer follows PIPEDA, Quebec Law 25, CASL and AODA.

Designing for Canada

What actually changed between the US and this edition

• Spelling - US edition: checking, color, center · Canada: chequing, colour, centre (with -ize kept)
• Currency - US edition: USD, prices after tax · Canada: $2,481,906.42 CAD, shown before tax; GST/HST (+PST/QST where applicable) added at checkout
• Institutions - US edition: FDIC, SEC, IRS, Social Security number · Canada: CDIC, OSC/Canadian Securities Administrators, CRA, SIN
• Products - US edition: T-bills, money-market funds · Canada: Government of Canada treasury bills; money market funds (CSA-regulated)
• Places - US edition: San Francisco, New York, Silicon Valley, Wall Street · Canada: Toronto, Vancouver, Waterloo Region, Bay Street
• Entity - US edition: LLC and US incorporation · Canada: Ontario corporations, LLCs and everything in between; Business Number (BN) before you finish an application
• Legal - US edition: US privacy and email consent · Canada: PIPEDA + Quebec Law 25, CASL express consent, AODA accessibility statement
• Look - US edition: Deep spruce, warm linen, brass; Fraunces + Hanken Grotesk · Canada: Cool greys, moss and sage with one restrained red; Inter Tight + Inter
• Footer - US edition: © 2026 Loon Inc. · San Francisco · New York · Canada: © 2026 Loon Inc. (fictional) · Toronto · Vancouver; FR toggle shown as a disabled 'bientôt / coming soon'

Brand adaptation

The same Loon, with a local accent

The brand keeps its calm, premium feel but shifts from the US edition's warm private-bank palette to a cooler, more civic one: moss and sage carry the interface, with a single restrained red used only for italic emphasis. Inter Tight and Inter give a crisp, highly legible feel on dashboards and long-form pages. The Loon wordmark and the wing mark are unchanged.

Homepage and key journeys

The homepage opens on a live balance card showing $2,481,906.42 CAD, with transaction rows in CAD and a metal corporate card. The most distinctive flow is the runway calculator: it updates live as you type, shows months of runway and the date the cash runs out, and adds plain-English advice. Prices on the pricing page switch between monthly and yearly and recalculate in CAD before tax.

Compliance, accessibility and trust

• Privacy policy under PIPEDA, with Quebec Law 25 noted for Quebec residents and the Office of the Privacy Commissioner of Canada as the complaint route.
• Express consent for commercial email, as CASL requires: an unticked checkbox, with Quebec visitors opting in.
• Accessibility statement under AODA, with WCAG 2.2 AA as the target.
• Terms of service noting that Loon is a fictional company and that banking services in the scenario are provided by CDIC-member partner banks.
• Passes automated WCAG 2.2 AA checks on every page at 360, 390, 768 and 1440 px: no contrast failures, no unreachable controls, no horizontal scrolling.
• A language switcher built from hreflang sits in the header on desktop and in the footer on phones.

One system, twelve markets

Every visible string lives in one file per market, and every colour and typeface in one theme file. This edition needed no new templates or components: a strings file, a theme, regional photography and local legal content made it a different brand experience. For a fintech company with international plans, a new market becomes a content project rather than a rebuild.

Deliverables

• Market profile: language, formats, legal and seasonality
• Full localised copy across 10 templates, header, footer and forms
• Brand adaptation: palette, type pairing and logo descriptor
• 10 regional photographs (Pexels, credited in credits.json)
• Local legal content
• Accessibility pass (WCAG 2.2 AA, automated) and QA at four screen widths
• Portfolio media: stills, full-page captures, scroll video, OG image, brand board