ICA Banken

Website
I redesigned ICA Banken’s “Become a customer” and mortgage transfer journeys, working within the bank’s new design
system to clarify steps, reduce friction, and improve completion. The work re-architected forms and content, introduced
pre-qualification and error-recovery patterns, and produced developer-ready screens grounded in user feedback and
regulatory constraints.
I redesigned ICA Banken’s “Become a
customer” and mortgage transfer
journeys, working within the bank’s new
design system to clarify steps, reduce
friction, and improve completion. The
work re-architected forms and content,
introduced pre-qualification and error-
recovery patterns, and produced
developer-ready screens grounded in
user feedback and regulatory
constraints.

My role

Visual / UX Designer

Team

UX Designer
Visual Designer

Timeline

14 weeks

Year

2019

Project name

Become a Customer and Mortgage
Transfer Journeys

Constraints

  • Align to the new design system.
  • Meet regulatory and legal requirements.
  • Ensure accessibility.
  • Maintain parity across devices.

Overview

Problem

Conversion through the “Become a customer” and mortgage transfer applications was lower than desired. Users faced long, dense forms, unclear eligibility and document requirements, and limited feedback when issues occurred. The business needed more completed, high-quality applications without increasing service load.

Challenge

  • Increase completion of both journeys without raising support tickets.
  • Make eligibility and document expectations clear before commitment.
  • Shorten perceived effort and reduce rework through better sequencing and validation.
  • Improve trust via clear language, predictable patterns, and accessible components.

Solution

  • A guided start that clarifies eligibility, time, and documents required.
  • Streamlined flows for both journeys using short sections, progress, and save/resume.
  • Inline validation and clearer error/recovery paths.
  • Microcopy that explains why sensitive data is needed, with expandable legal detail.
  • Accessible components and responsive layouts aligned with the design system.
  • Developer-ready specs including alternate states, validation rules, and edge cases.

Results

  • Participants reported greater clarity on what was required and why.
  • Fewer hesitations and back-and-forth within the forms.
  • Improved wayfinding with progress and clearer sectioning.
  • Higher stated confidence to complete the application without assistance.
  • Reduced step-level drop-off due to pre-qualification and expectation setting.
  • Cleaner submissions with fewer validation errors, lowering manual review time.
  • Faster delivery through design-system reuse and tighter specs.

Research

Activities

  • Current-state audit of both application flows, screens, and error paths.
  • Design system review to understand available components and gaps.
  • Light stakeholder interviews (product, operations, compliance) to surface risk and data needs.
  • Rapid, task-based qualitative tests on prototypes to validate comprehension, sequence, and copy.

Insights

  • Users were unsure about eligibility and documents until late in the process.
  • Forms interweaved critical and non-critical data, increasing effort and abandonment risk.
  • Error states were generic; recovery paths were unclear.
  • Dense legal copy obscured the “what” and “why” behind sensitive fields.

What we measured during the project

  • Task success and time on task in qualitative tests.
  • Observed hesitation and error points.
  • Stakeholder feasibility checks to avoid rework at handoff.

What to track post-launch

  • Step-level drop-off and completion rate.
  • Field-level error frequency and re-entry.
  • “Save and resume” usage and return-to-flow success.
  • Contact-centre contacts related to application friction.
A screen from the website designed for ICA Banken.

Process

1. Discover

  • Audited flows.
  • Mapped dependencies.
  • Captured compliance requirements and data capture needs.

2. Define

  • Set success signals.
  • Design principles.
  • A risk log (privacy, data retention, consent).

3. Design

  • Information Architecture.
  • Flow maps.
  • High-fidelity screens using the bank’s design system.
  • Wrote microcopy with legal review.

4. Test

  • Scenario-based qualitative sessions on desktop and mobile.

5. Iterate

  • Refined sequence.
  • Pared back fields.
  • Tightened copy and validation rules.

6. Handoff

  • Developer-ready specs with states, edge cases, and content guidelines.
Three screens from the website designed for ICA Banken, formatted for a mobile viewport.

Key decisions

Eligibility first

Introduce a brief pre-qualification step (e.g. residency, age, income band, product fit) before the main form. Because early disqualification prevents wasted effort and reduces incomplete applications further downstream.

Front-load expectations

Show a “what you’ll need” checklist (ID, income proof/BankID, time estimate) before users start. Because setting expectations improves perceived control and reduces abandonment caused by surprises.

Short, sequenced steps

Break long forms into logical sections with a persistent progress indicator and “save and resume”. This lowers cognitive load; supports real-life interruptions common in financial applications.

Inline validation and smart defaults

Immediate, field-level validation and masked inputs; reuse previously entered data where possible. This reduces errors and rework, increasing first-time completion.

Clear, layered copy

Rewrite microcopy for clarity and move legal detail into expandable “learn more” sections; keep required consent clear and explicit. This preserves compliance while keeping the core task legible.

Error recovery and support

Specific error messages, preserved inputs on error, and clear recovery paths; contextual help and optional handoff to support. This protects user effort and reduces support contacts.

Design-system-first implementation

Use existing tokens/components and extend only when necessary, documenting new patterns. This speeds delivery, ensures consistency, and lowers maintenance cost.
Three screens from the website designed for ICA Banken, formatted for a mobile viewport.A screen from the website designed for ICA Banken.

Risks and how they were managed

  • Compliance and consent. Partnered early with legal. Surfaced consent moments clearly. Documented data flows in specs.
  • Integration dependencies. Mapped data calls and designed resilient states for slow or failed responses.
  • Scope creep. Prioritised changes by impact versus engineering effort.
Up Next

IKEA

Content Management System
I designed a content management system
that is making it simple for employees to
create, manage, distribute, promote, and
track content using a ‘create once,
publish anywhere’ approach.
An arrow pointing right.
A plant.