— Case / Design & Frontend
Digital platformUX/UI design and Frontend development
- Digital platform from scratch
- UX/UI design + Frontend
- Backend — on the client’s side
Full cycle of interface design and Frontend development for a digital platform built from scratch.
— Overview
User-facing platform built from scratch
The project covered the full cycle of interface design and frontend development for a platform built from the ground up. At the point our team joined, the product had no established user interface, no finished frontend and no unified design system. The backend was being developed separately on the client’s side, while the API and certain elements of the business logic continued to evolve and be refined throughout the project.
The team’s scope of responsibility was considerably broader than simply creating mockups and implementing them: the business logic and backend capabilities had to be turned into a coherent digital product, with a UX/UI architecture, a scalable interface system, a working frontend and, at the same time, a process that let Design, Frontend and Backend evolve in parallel.
— Objectives
What had to be solved
01
Design the product’s user-facing part from scratch. At the point the team joined, the product had no established user interface, no finished frontend and no unified design system.
02
Turn the platform’s technical capabilities and business logic into a product structure clear to the user. The team had to define the information architecture, the core user scenarios and the relationships between functional areas, screens and system states.
03
Organize frontend development in parallel with the backend. The API and business logic kept evolving throughout the project, so the approach had to let individual parts of the interface be designed and implemented as they reached sufficient readiness.
04
Synchronize several development tracks. Design, Frontend and Backend had to move forward simultaneously without creating constant blocking dependencies on one another.
05
Define clear rules for when a design is ready, how it is handed off to development and how changes arising as the product evolves are handled.
— Solution
How the work was set up
Product architecture and UX/UI system
- The work began by translating the available business and backend logic into user scenarios
- The team defined the product’s functional areas, the links between them and the sequence of user actions
- System states and the principles of interacting with the platform’s functionality were described alongside the scenarios
- In this way the technical logic was gradually turned into a structured user experience
- A unified approach to interface design was established for the platform
- Recurring controls, navigation solutions, forms and states were designed as reusable patterns
- This ensured UX/UI consistency and simplified further expansion of the product
Development-ready Design and Frontend
- Before a functional block went to the developers, the required states, interaction logic and sufficiency of the designs were verified
- After the Design Review the prepared part of the product moved on to Frontend, while the designers continued with the next areas
- Questions that arose directly during implementation were resolved jointly by Design and Frontend
- Whenever requirements or backend logic changed, the corresponding decisions were updated
- Frontend development proceeded incrementally — as individual functional blocks became ready
- This approach turned approved decisions into a working interface faster, and let technical feedback shape the design of the next parts
- The backend was treated as a technical layer evolving in parallel, with which the frontend was integrated progressively
— Results
What was delivered
- UX architecture of the platform — the structure of user interaction that combines the product’s functionality into coherent scenarios.
- UI system — unified visual and interactive principles and reusable solutions designed for the platform’s further growth.
- Screens and user scenarios — a set of interfaces designed from scratch in line with the product’s business logic.
- Frontend — implementation of the designed interface and its preparation for interaction with the independently developed backend.
- Design-to-Development Workflow — the process of preparing, reviewing and handing off individual functional areas from design to frontend development.
— Highlights
What was unusual
Beyond mockups
The scope went far beyond creating mockups and implementing them: from UX/UI architecture to Frontend and the way the teams worked together.
Logic into scenarios
The available business and backend logic was turned into user scenarios, functional areas and system states.
Patterns, not screens
Controls, navigation, forms and states were designed as reusable patterns rather than as separate screens.
Design Review
A block moved on to Frontend only after its states, interaction logic and the sufficiency of the designs had been verified.
Three tracks at once
Design, Frontend and Backend moved at the same time: parts of the product went into implementation as they became ready, and changes were absorbed along the way.
— Conclusion
The client received a user-facing part of the digital platform built from scratch: UX/UI, a unified interface system and a frontend implementation.
The team organized the work so that Design, Frontend and Backend could move forward in parallel: individual functional parts went from design to implementation as they became ready, and changes in requirements and technical dependencies were accounted for directly during development.
— Area of responsibility
What the team owned
01
UX & Interface Architecture
Designing the platform’s interface architecture, developing user scenarios and interaction logic, UX design.
02
UI & Design System
UI design, creating reusable interface patterns, evolving the platform’s UI system.
03
Design-to-Development
Preparing designs for development, Design Review before handoff to Frontend, organizing collaboration between Design, Frontend and the client’s backend team.
04
Frontend Development
Implementing the designed user interface, organizing frontend development, preparing for integration with the client’s backend, adapting the frontend to evolving APIs and business requirements.