Aranja + Memento

Memento Payments

Developing a cutting-edge marketing page for an ambitious FinTech startup from Reykjavik.

Tech stack

For this project, we relied on trusted, proven technologies that we've had ample experience with. We chose Next.js for its robust features and versatility - a platform we've successfully used in numerous projects. Additionally, we utilized Framer-motion, a library we've enjoyed for its capabilities in animating complex user interfaces over the past few years. These technologies enabled us to effectively turn Memento Payments' ambitious vision into a sleek, functional, and engaging website.

TypeScript

Strongly typed programming language

Next.js

React website framework

styled-components

CSS-in-JS

Framer Motion

Animation library

Zustand

State-management solution

A Step Ahead of the Competition

When Memento Payments, a pioneer in creating a generational social payment platform for banks, approached us, they brought along an ambitious vision. Their flagship product, a highly customizable white-label app platform, needed a website that could truly reflect its groundbreaking nature. Michael, their in-house designer, had a grand design plan in mind, complete with animated and interactive illustrations to showcase the platform's prowess.

From the get-go, it was clear that Memento Payments' high standards matched our commitment to quality. We were eager to join them in bringing this vision to life.

Pushing Boundaries, Breaking Limits

The goal for the website was to strike a balance between professional and playful. We worked on animating the typography in a way that amplified rather than obscured the message. Subtle interactions and pointer events were designed to capture user interest without overwhelming them.

Our adventurous experiment with large interactive illustrations quickly tested the performance limits of SVG (Scalable Vector Graphics). These scenes, which highlighted simplified versions of Memento Payments' app platform and dashboard, contained numerous nodes that we aimed to animate seamlessly. It became clear that we could reimagine the artwork using HTML and CSS. The outcome was impressive – we achieved improved performance, more control, and enhanced interactivity.

All the artwork is done using HTML and CSS which allows us great control over it.

Ensuring Accessibility Across All Sizes

On the mobile version of the website, we've crafted a pricing page that shines in its design. It effectively compares three pricing plans on a small screen, using both horizontal and vertical sticky panels in an intuitive manner. Swiping or scrolling a panel syncs with the opposite panel, ensuring the user never loses sight of important details.

Given Memento Payments' expansive upcoming plans, we constructed a mega menu to provide easy access and a comprehensive overview of their software's features and services. On the smallest viewports, this mega menu showcases multi-level navigation with swift and satisfying transitions between levels.

“Memento Payments needed a new website to better represent the products we are offering. We had heard great things about Aranja but they exceeded our expectations. It was an absolute joy to work with them and I would recommend them to anyone wanting to create a beautiful product.”

Guðberg Sumarliðason

Product Manager — Memento Payments

Other projects

Gangverk

Pick a project to learn more