S-Pankki — A digital refresh
A refresh without starting from scratch
S-Pankki set out to refresh its digital presence to better reflect a customer-oriented, down-to-earth bank for everyone. Rather than redesigning from scratch, the task was to modernise the look within an existing design system.
We defined the visual direction and design principles together with S-Pankki’s in-house design team, focusing on clarity, friendliness, and confidence — while staying grounded in the structural and technical realities of the system.
The design system as a buffet
S-Pankki is part of S Group, a large Finnish co-operative behind many everyday services in Finland and uses an adapted version of the group’s shared design system.
We carefully studied the existing design system — its components, rules, and limitations. Rather than treating it as a fixed rulebook, we approached it like a buffet, selecting, combining, and sometimes leaving things out, creating a clearer, more focused digital branding for S-Pankki.
Turning cold conservative into approachable
We picked rounder, softer shapes to feel more human and approachable, generous white space to reduce visual stress, and confident headlines that communicate quickly and clearly. The result is a calmer, more open interface that feels less institutional and more aligned with modern everyday banking.
Motion as part of the visual language
Motion design had not yet been defined as a core building block of the system. We therefore treated motion as an integral part of the experience, extending the visual language beyond static interfaces.
Drawing inspiration from existing brand elements — such as the S-Pankki logo animation or easing used in advertising. We defined a set of motion principles to guide micro-interactions, transitions between states, and feedback for user actions. The resulting motion language feels friendly, speedy, and supports usability without drawing attention to itself.
Just making things more simple
Bank websites often end up trying to say everything at once. Our goal was to make things easier by portioning information creating clarity through space, instead of explaining more.
Big, friendly buttons and simple visual grouping help people know where to go next, without stopping to think. The neon green is used like a highlighter — only where it helps — guiding attention and adding energy without making the page feel busy.
A design-first outcome
By working thoughtfully within an existing system, the refreshed visual direction shows how design choices even in a restricted environment can help modernise a large financial service — making it feel more human, more approachable, and more aligned with its values.
Instead of adding more features or explanations, we relied on clear structure, hierarchy, and restraint — staying true to S-Pankki’s promise of simplicity and fairness at scale.
