UI / UX

upgreight: Responsive UI for a Webflow Agency

upgreight, a Swiss-based Webflow development agency, required a modern, sophisticated web presence that would effectively showcase their expertise in creating high-end websites. The project encompassed a complete website design system and responsive layouts for multiple pages, including Homepage, Team, Why Webflow, Pricing, and Partners sections.

Key objectives included maintaining consistency across multiple page types and designing an intuitive user journey for potential clients and partners.
Desktop, mobile and tablet view o the Let's cook website.
Objectives
Design System, UI
Published on
01 July 2024
View website

Design Approach

Building on the existing homepage design, I expanded upgreight's website through additional pages that naturally followed the already established aesthetic. The design implements a dark theme with modern accents, and we utilized clean contemporary typefaces to enhance readability. The bento grid systems are great for creating an engaging content presentation, and I integrated Relume library components to ensure the consistent UI throughout the site.

I placed emphasis on high-end quality through responsive design across web and mobile devices. We further optimized the SEO structure with the layout and typography. I organized the service offerings to showcase the company's full range of expertise - from Webflow website creation and relaunch services to migration, landing page development, and SEO optimization. To build trust and credibility, we highlighted the impressive 99.9% client satisfaction rate, and strategically positioning partner logos throughout the design.

Let's Cook Homepage split into two parts - before the Subscription and after it. A lot of cards with recipes.

Technical Implementation

We utilized Figma for design work, incorporated the Relume component library, and built it on Webflow, following a mobile-first approach for responsive development.

This project is demonstrating the value of component reusability through effective use of the Relume library, which significantly accelerated the design process while maintaining consistent styling. User experience was optimized through clear navigation structure, intuitive form designs, and effective information hierarchy.

Let's Cook Homepage split into two parts - before the Subscription and after it. A lot of cards with recipes.
View website

Related case studies

UI / UX

Botanical Syrups

E-commerce website for one of Australia's best homemade organic syrups.
Lettering

Lettering Collection 2020-2023

A huge collection of lettering and typography projects.
Illustrations

Blog Illustrations for XWP

Vector illustrations for one of the leading enterprise WordPress agencies.