Rocker

Case study

Rocker

Rocker is an app where you can collect your entire personal economy.

Type Apps & web Service UX/UI, Accessibility & Marketing Program Figma WCAG 2.1 AA Platform Android, iOS & Gatsby
3 Websites designed
2 Apps (Android & iOS)
AA WCAG 2.1 compliance
8pt Grid-based design system

01

Design approach

Rocker was a big client where I worked as a consultant. I divided my responsibilities between the websites, the apps and marketing. My assignment started with a deep dive into Rocker as a company and its users. After researching, I started working on the primary web, where keywords such as playfulness, colorful and credibility were the most important. I created a style guide and a component library where an 8pt grid was standard throughout the design.

After the first web, I spent my time designing the apps, created marketing materials, did product design and package design. Then I went on with two new websites for new products that would launch: Rocker Buddy and Rocker Pay.

02

Rocker Pay

Rocker Pay was one of the new product websites I designed from scratch. The goal was to create a clean, trustworthy experience that communicated the simplicity of the payment solution while staying true to the playful Rocker brand.

Rocker Pay desktop screenshot

03

New card design

I led the project to turn all our physical payment cards into digital versions. I also created a new design for our new digital card. This work made our payment methods more modern and improved how users interact with our services.

Rocker card designs

04

Marketing content

I worked closely with the head of marketing and our legal team to produce digital ads and social media posts. My role was crucial in ensuring our content was visually compelling, engaging, and compliant with legal standards. This experience highlighted the importance of collaboration and creativity in developing effective marketing strategies, with my design expertise driving the visual aspect of our campaigns.

Rocker iPad marketing

Marketing

Rocker Instagram post

Check out the design at www.rocker.com (opens in new tab), www.pay.rocker.com (opens in new tab), Google Play (opens in new tab) or the App Store (opens in new tab).