Caterina Finelli
Caterina Finelli

inFi - Indoor Navigation App


  • MY ROLE: UX Design, UI Design, Prototyping, User Research, User Testing.

  • METHODS: Competitive Analysis, Desk Research, Contextual Inquiry, User Interviews, Usability Testing.

  • TECHNOLOGY: Ionic Framework.

  • DELIVERABLES: Responsive Admin UI, Cross-device mobile app.


1. Empathize: Getting to Know the Problem

When I first heard about indoor positioning, I thought it was just like GPS, but indoors—no big deal, right? Well, I was so wrong. The client’s vision was much more exciting:

  • Real-time tracking of multiple people inside a venue.

  • Adding social features like messaging, friend requests, and even group games.

This felt like something out of a sci-fi movie, so I dove deep into research. That’s when I discovered IndoorAtlas, a platform that uses geomagnetic fields for indoor tracking. It even offered tools for deploying custom apps for specific venues.

We pitched the idea of a Control Panel to help venue owners monitor foot traffic in real time, and the client loved it.

Workshops, brainstorming, and user research sessions helped us shape the app’s identity. We called it inFi, inspired by “indoor” + “fidelity.”

And since the client was a big FC Bayern fan, the very first non-negotiable request was that we used their iconic colors for the branding, while the rest was inspired by maps and navigation softwares iconography.

Below you can check the process from pencil to vector, and some color tests:


2. Define & Ideate: Coming Up with Solutions

We wanted inFi to be the ultimate companion for anyone exploring airports, museums, or conference halls for the first time. To get there, we focused on three big things:

Building Personas & User Flows

We imagined how different people would use inFi and sketched out their journeys, like:

  • Finding their way using indoor maps.

  • Checking into venues.

  • Exploring points of interest (POIs).

  • Seeing nearby users and connecting with them.

Agile Board with the first use cases collected.

Handling Privacy the Right Way

Privacy was a huge concern. We didn’t want it to feel like a creepy “Big Brother” app where admins could spy on everyone. Instead, I came up with a mutual visibility switch: you can only see someone’s location if they’ve shared theirs with you. It created trust and gave users control.

Keeping Admins Happy Too

For venue admins, we designed tools to make their lives easier, like:

  • Sending bulk messages.

  • Viewing real-time traffic on floor plans.

This way, we made sure both users and admins got what they needed.

Visibility switch tests

3. Prototype: Bringing Ideas to Life

Here’s where the fun really started—turning our ideas into something we could actually test.

Sketching It Out

I started with low-fi wireframes, keeping everything simple. This let us focus on how things worked, not just how they looked. Mapping out interactions and catching errors early saved us tons of time later.

Teaming Up with Developers

Since we were using IndoorAtlas, we chose the Ionic Framework for the app—it’s perfect for building cross-platform solutions. For the admin side, we went with the Foundation Framework to keep things stable and responsive.

Active floorplan live view
Venue account settings
Staff members managment
Edit staff memeber modal
Visitors managment
Edit visitor type modal
Venue description and opening times

Testing the Prototype

Using Sketch and InVision, I created clickable prototypes. We handed them to stakeholders to play around with on their devices. The feedback was super helpful for refining the design and fixing any hiccups.

Initial wireframed prototype

4. Test: Making Sure It Works for Real People

User testing was key to making inFi something people would actually want to use. Here’s how we approached it:

Usability Testing

We brought in people to test the app in realistic scenarios, like navigating an airport or exploring a museum. Here’s what we learned:

  • Navigation was mostly intuitive, but first-time users needed clearer onboarding.

  • The mutual visibility switch was a hit—it made people feel in control and safe.

  • Fun touches like the proximity compass made the app feel more engaging.

A/B Testing

We also tested different versions of key features, like how to guide users to Points of Interest (POIs). The results? Minimalist cues and helpful text worked best, boosting success rates by 23%.

Iterating on Feedback

We took everything we learned and made changes. For example:

  • Adjusting font sizes to make them readable in dimly lit venues.

  • Adding tooltips to make admin features easier to learn.


5. Design: Making it Beautiful and Easy to Use

inFi was a tricky balance—it had to be both a navigation tool and a social app.

Gamifying the Experience

We added playful touches to make it fun, like:

  • Proximity compasses for nearby users.

  • Navigation elements inspired by dating apps (yes, swiping works for more than just matchmaking!).

Keeping It Simple

I followed Steve Krug’s golden rule: “Don’t make me think.” Everything—from colors to button placement—was designed to feel intuitive. If you didn’t have to stop and think, I knew I did my job right.

Polishing the Details

We took inspiration from FPS games to offer users familiar views, like:

  • First-person perspectives.

  • Bird’s-eye layouts.

This mix of familiarity and innovation made the app feel just right.

Splash screen
Walkthrough
Active floor live
Social locator
Social filter
Venue infolayer
Messages
Notifications

6. Implement: Helping Developers Get It Right

Building a Style Guide

To keep everyone on the same page, I documented:

  • Components and their states.

  • Typography and color hierarchies.

This worked great for our team, but when the client wanted to scale inFi globally, we needed something even more robust.


Introducing Interactive Guidelines

Thanks to an open-source plugin, I created an HTML-based style guide. Developers could see every detail—sizes, colors, interactions—all in one place. It saved tons of time and reduced mistakes.


Final Thoughts

The journey to build inFi wasn’t just about creating a navigation app—it was about designing something that connects people and makes exploring fun.

By focusing on user needs, testing our ideas, and collaborating closely, we turned a futuristic vision into something practical and user-friendly.

Check out the interactive prototype and final designs to see how inFi brings people together in new and exciting ways!

Send Caterina Finelli a reply about this page
More from Caterina Finelli
Live Rec – Redefining Music Composition with Everyday Sounds
3 min read
Back to profile