smArt

City Tour

smArt

City Tour

Cultural Experience Mobile App

Cultural Experience Mobile App

UX/UI

UX/UI

Every 2 months, San José, Costa Rica holds an open event, in which the entirety of its cultural offer forms a night tour, called the Art City Tour. We worked directly with the tour’s producer to come up with a concept app that could enhance the visitors’ experience.

Every 2 months, San José, Costa Rica holds an open event, in which the entirety of its cultural offer forms a night tour, called the Art City Tour. We worked directly with the tour’s producer to come up with a concept app that could enhance the visitors’ experience.

Developed by

Juan Ignacio Garro
Industrial / Experience Designer

Raúl Cabezas
Industrial / Brand Designer

Sofía Brenes
Industrial / Visual / UX Designer

Ckeck it in full

Ckeck it in full

You can have a look at the full case study for this project in the following Behance page.

Go to case study

Go to case study

Or if you’d like, you can also go through the final UI design system that was put together.

System

Design

01 Color palette

main

gradients

secondary

Mobile App

neutrals

02 Tipography

others

bold

regular

16 px (1 rem)

Links

74 px (4.625 rem)

Display

60 px (3.75 rem)

Title 1

48 px (3 rem)

Title 2

12.5 px (0.781 rem)

Text 3

10 px (0.625 rem)

Captions

38 px (2.375 rem)

Title 3

30 px (1.875 rem)

Title 4

24 px (1.5 rem)

Subtitles

18 px (1.125 rem)

Text 1

Text 2

16 px (1 rem)

74 px (4.625 rem)

Display Bold

60 px (3.75 rem)

Title 1 Bold

48 px (3 rem)

Title 2 Bold

10 px (0.625 rem)

Captions

30 px (1.875 rem)

Title 4 Bold

Subtitles Bold

24 px (1.5 rem)

18 px (1.125 rem)

Text 1 Bold

Text 2

16 px (1 rem)

Text 2 Medium

16 px (1 rem)

03 Iconography

04 Graphic Elements

08 Molecules

main navigation menu

galleries

Explorar

Rutas

Experiencias

Perfil

Explorar

Rutas

Experiencias

Explorar

Rutas

Perfil

Explorar

Experiencias

Perfil

Rutas

Experiencias

Perfil

La Edición

Generalidades del Tour

Óscar Soto

Aimee Joaristi

6:30 p.m. - 10:00 p.m.

Pedregal

7:30 p.m. - 10:00 p.m.

6:30 p.m. - 10:00 p.m.

Barrio Amón

Barrio Otoya

Beyond Van Gogh: The Inmersive Experience

Memorias en piedra: Monumentalidad en la escultórica precol...

NaturAnima

Ariane Garnier y Carma Casulá

05 Elevations

16 px

80 px

80 px

80 px

80 px

Menu Bar

Search Bar

Cards

PopUp

Galerías, Museos, Artistas...

Blur: 4

Spread: 14

Color: #0F1F32, 80%

x=0 , y=0

Search Bar

06 Layout

07 Atoms

Default

Disabled

Pressed

Focused

Default

Pressed

Selected

primary buttons

secondary buttons

buttun anatomy

search bar

Galerías, Museos, Artistas, Eventos...

Galerías, Museos, Artistas, Eventos...

|

Cancelar

Default

Default

Vertical padding: 8 px (0.5 rem)

Horizontal padding: 16 px (1 rem)

Corner radius: 16 px (1 rem)

Vertical padding: 15

Horizontal padding: #0F1F32

Corner radius: 12 px (0.75 rem)

© Juan Ignacio Garro / 2024