Skip to content

JHONATAN OLIVEIRA®

PORTFOLIO / 2026

FRONTEND / PRODUCT / DESIGN

Engineering, direction and digital craft in one continuous system.

ISSUE / 01

Project archive

02 / Case study

UI Design / 2026

Bibi Mobility

Interface created for the urban mobility app

Bibi Mobility
J / O — UI Design

Case index

01 — 04

Discipline
UI Design
Year
2026
Status
Completed
Visual records
06

Technologies

FigmaAdobe Photoshop

Bibi Mobility — Institutional website with a focus on clarity, trust, and social impact

The project for the Bibi Mobility institutional website was developed with the goal of translating a complex operation into a simple, human, and trustworthy digital experience.

Bibi operates in the urban mobility segment with strong social impact, dealing daily with users, companies, and institutions. The central challenge of the project was to create a website that communicates credibility, clearly explains services, and, at the same time, is accessible to diverse audiences.

The challenge

Before the project, Bibi's digital communication needed to evolve in three main points:

  • Making services easier to understand

  • Strengthening the institutional brand perception

  • Creating a modern experience, without losing seriousness and accessibility

This was not just about “making a pretty website,” but about organizing information, building trust, and guiding the user.

The solution

The website was thought of as a clear and objective institutional platform, with a focus on:

  • Well-defined information hierarchy, facilitating reading and navigation

  • Clean and functional design, prioritizing legibility and understanding

  • Accessible visual language, suitable for different user profiles

  • Fluid experience, both on desktop and mobile devices

Each section was designed to quickly answer the user's questions: who is the company, what it does, how it operates, and why it is trustworthy.

Design decisions

  • Conscious use of colors to convey security and professionalism

  • Clear typography, focusing on prolonged reading

  • Layouts that avoid excessive visual elements and reinforce organization

  • Visual components that help explain services without relying solely on text

Everything was thought out to reduce cognitive friction and make navigation intuitive.

Result

The project delivers an institutional website that:

  • Strengthens Bibi Mobility's digital presence

  • Communicates services objectively

  • Reinforces its values and social impact

  • Conveys trust from the first contact

More than a visual redesign, this project represents a strategy, UX, and communication work, aligning business, user, and brand in a single digital experience.

04 / Visual evidence

06 ITEMS

The work, in context.

Screens, motion and supporting artifacts that show how the system behaves beyond a static cover.

Selected work / archive

END / CASE

One case is only one chapter.

Return to the archive to see other interfaces, products and experiments built with the same attention to product, visual direction and frontend engineering.

View all projects