Eolo Web App

08/2022

UX/UI Design, Visual Design

Giada Viti

Location-Based Recommendations Web App Eolo

Project date: 2022

UI refresh: 2025

The interface has been updated to reflect current Social Auth branding and iOS safe-area standards for the 375 pt viewport.

Introduction

Because location-based recommendation apps have become so essential and widely used, I chose this topic for my personal UX and UI case study.

As an expat, I find these apps invaluable for discovering new places and staying informed about what’s happening nearby with ease and speed. They’re equally useful when exploring your hometown or planning a trip to a new destination.

My Role

As the UX / UI designer for this project, I managed the entire process starting from competitive analysis, user research, information architecture, user testing and visual design.

The Eolo App

Eolo is a location based-recommendations app that helps users to find a specific place, service or shop. It provides alternative routes, tailored recommendations and notifications to let users better know the surroundings based on their interests and preferences.

The app can be used while walking, driving, or using public transportation. It is designed for users who want a more accurate and reliable guide when heading to a specific place, as well as for those seeking a more engaging experience by exploring the surrounding area. The app provides this by sending notifications about nearby events and newly opened shops.

The Problem

Many location-based recommendations apps often provide unclear, non updated information regarding a specific shop/position, or suggest longer routes, which force users to switch to a second application to complete their tasks. Users expect the app to deliver a more personalized experience, including tailored suggestions, contextual support, and adaptable content that matches their individual preferences and needs.

Competitive Analysis
Foursquare City Guide

Foursquare released several products including Foursquare City Guide and other native apps. They built independent platforms to understand how people move around the world and they seem to have a strong presence in the market in the location technology, data, analytics and engineering industry.

User Interview

I interviewed three frequent users of similar apps in varied daily contexts. Each had distinct backgrounds and nationalities.

User Personas

From the user interviews, I gathered key insights that led to three distinct user personas.

Creating these personas clarified user contexts, attitudes, and behaviors, and they became a valuable reference throughout the rest of the design process.

User Flow

User flow created with Lucidchart.

Prototype
Low-Fidelity Wireframes

Using a rapid prototyping approach, I developed these initial sketches to explore the core user flow.

After four iterations and, based on insights from User Testing, I implemented several structural refinements. These changes ensured a more intuitive experience, establishing a solid foundation for the Mid and High-Fidelity designs.

User Testing
Goals

The goal was to evaluate mobile usability with three users, observing whether they could easily understand the information architecture, navigate, and complete specific tasks.

Branding
Logotype
Typography

Raleway and League Spartan, two clean sans-serif Google fonts.

Raleway handles headings, buttons, and navigation for its elegant personality. League Spartan covers form fields, filters, and body text with its versatile clarity.

UI Screens

A clear information hierarchy prioritizes structured reviews and real-time updates within the primary focal point, followed by rich media and secondary details for deeper exploration.