Spotly — mobile app design

UI & visual identity

High-fidelity phone mockup displaying Spotly's Welcome screen

Project overview

Spotly is a travel app concept designed in 2021 as a mobile interface study for the Intro to UI Design course brief.

Working from provided UX wireframes, I focused on creating a clean, cohesive, and engaging visual system optimized for iOS mobile screens.

The platform allows users to explore travel destinations while building a community through likes, comments, and shares.

My role

UI/Visual designer. I managed the user interface and visual design execution.

Tools

Adobe XD, Adobe Illustrator, Adobe Photoshop.

The app concept was developed across five mobile screens. Selected screens are shown in this presentation:

  • Welcome
  • Sign in
  • Destinations
  • Destination articles
  • Open menu
Mobile phone mockup displaying the destinations and a destination article screen

Mood board

The visual direction combines a balance of soft and vibrant colors with editorial travel imagery to create an inspiring, friendly experience. White and pastel tones support readability, while destination photography adds depth and a sense of discovery.

Vibrant mood board for Spotly featuring mobile UI screens, colors, and typography.

Welcome and sign in flow

Mobile phone mockup displaying a sign-in screen alongside an error state message panel.

Target users

Spotly is designed for young adults and travelers worldwide.
These users seek to explore new destinations through the lens of authentic experiences. Whether looking for daily inspiration or a complete escape from routine, users can browse curated destinations and community insights to plan their next journey.

The following mockups present the destinations interface and selected views from destination article pages:

Mobile phone mockups displaying the destinations and a specific destination article screen.
Woman holding a mobile phone displaying a destination article page.

Visual identity

I named the app and developed its visual branding, from custom logo and icons to typography and color palette.

Spotly app logo

The logo is adapted in the following iOS sizes:

  • 152px - iPad
  • 120px - iPhone
  • 80px - Spotlight
  • 58px - Settings

Details were simplified at smaller scales to ensure clarity and legibility.

Logo iOS app icon variations for iPhone, iPad, Spotlight, and Settings
Looping animation of the Spotly interface icons for like, comment, share, and search.
 svg expand -  App color information
 svg expand - typography style sheet