AVSA Rent a Car – UI/UX Redesign
Redesign of a car rental website in Chiloé, focused on visual improvement and basic usability principles. It included updated content, a clearer visual identity, contextual imagery, a new FAQ module and a direct contact channel to make renting easier.
Marie Garrido- Role
- UX/UI Designer
- Agency
- Laika, the digital agency of Dittborn & Unzueta
- Context
- Website for AVSA Rent a Car, in Chiloé
- Scope
- One-page landing: visual system, reusable components, rewritten copy, a new FAQ and direct contact, in desktop and mobile versions
- Outcome
- A more orderly, understandable interface that fits the real needs of users
- Limit
- No UX research, interviews or user testing
Project context
The client needed to redesign their website to modernize its look, reinforce the territorial identity of Chiloé and make the service clearer.
The brief was to build an informative landing page with section-based anchor navigation, focused mainly on UI design and applying usability principles and good reading practices.
This project did not include UX research, interviews or user testing. The design prioritized visual clarity, consistency and an intuitive browsing experience.
Although the main focus was UI design, key improvements to content and information structure were made along the way, contributing significantly to the user experience.
Design scope
UI design
- A complete visual system: colors, typography, spacing, iconography.
- Reusable components.
- Responsive design for desktop and mobile.
Content restructuring
The original site had unclear, outdated copy with inconsistent tone. The main texts were rewritten:
- Hero / value message
- About section
- Fleet section
- Operating Leasing module
- Terms and Conditions
Why this improvement was included in the redesign:
- Clarify AVSA's value proposition.
- Improve understanding of the service without adding complexity.
- Create a consistent, professional tone across the whole site.
- Make reading simpler, more direct and aligned with the visual identity.
Usability adjustments
The main adjustments include:
- Better legibility through typographic adjustments and higher contrast.
- Clearer visual hierarchy for immediate understanding of the offer and the steps to rent.
- More visible, consistent calls to action aimed at improving conversion.
- Relevant imagery that supports understanding of the service.
- An FAQ, which the previous version lacked, to reduce friction and answer key questions.
- A direct contact channel to simplify the rental process and remove unnecessary steps.
- Basic accessibility improvements such as alignment, spacing, clear labels and distinguishable interactive elements.
Limitations
The project did not include UX research, interviews, testing or in-depth benchmarking.
Design process
We decided to work under these principles:
Visual First design (UI-driven)
The client needed modernization and visual clarity.
Consistency over novelty
Favor familiar navigation patterns.
Simplicity
A lightweight one-page structure, quick reading and clearly delimited sections.
Territorial storytelling
Photographs of the surroundings to reinforce local identity and an "outdoor" feel.
Usability and accessibility
Although there was no UX research, good practices were applied:
Jakob's Law
Familiar navigation patterns were kept, especially in booking.
Fitts's Law
Buttons and CTAs with large clickable areas.
AA contrast
Readable text guaranteed on both dark and light backgrounds.
Law of proximity
Related content is grouped for quick reading.
Scannability
Independent blocks to avoid visual noise.
Persistent navigation (side menu)
Helps users keep their context on a long one-page site.
UI design
Improving identity and legibility
Typography
Medium · Semi Bold · Bold
| H1 | DM Sans Bold/Medium | 50/60 |
|---|---|---|
| H2 | DM Sans Bold | 48/20 |
| H3 | DM Sans Bold | 32/24 |
| Body 1 | DM Sans Bold | 18/60 |
| Body 2 | DM Sans Medium | 16/60 |
| Button | DM Sans Bold | 24/14 |
Color palette
#1A1A1ABase text. Main text, headings, content.
#FFFFFFGeneral background. Site background, primary sections.
#171F14Form and active-menu background, contrast sections, dark content modules.
#F8E2DFFAQ, soft informational blocks, support cards.
#CC433CPrimary buttons, icons, calls to action, visual indicators.
Buttons
Previous screens
Screens of the site before the redesign process (original site in Spanish).
Desktop version
Optimized for a spacious, visual and comfortable desktop experience (interface in Spanish).
Mobile version
Designed for clear, accessible navigation on small screens (interface in Spanish).
