We’ve been asked to promote a city of our choice representing the brand and campaign in a logo and website, translating the branding and visual identity throughout different marketing collaterals.
On this project I was working on my own taking charge of both UX & UI tasks.
I decided to focus on the city of Paris because no place in France is more special than the capital.
Moreover, my passion for arts and culture was calling for its museums and architectural landmarks, with the Louvre in the top most visited art museums in the world.
Tools: Photoshop, Illustrator, Sketch, InVision, Principle
A number of deliverables where included in this project, here’s a quick breakdown:
- Two initial art direction, pursuing one of them for final presentation
- Logo Guidelines
- Typography and colours
- Imagery and photography
- Social media and diplay Ads for the website
- Affinity Diagram
- Style Tiles
- Style Guide
- Low fidelity wireframes
- High fidelity mock up
- Prototype of design(s)
- Final presentation
The research process started with inception design and two different art directions. I decided to bring forward the one that was giving more relevance to couples that wanted to spend a romantic weekend in Paris instead of going camping in the countryside with friends. On this art direction the main keywords for the mood were: special, romantic, unique, safe and guided.
Colours with a low saturation combined the French flag with the mood.
Movement is slow and fluid with rounded and protective shapes.
The final Moodboard translate the inception design in visual elements helping visualising a first shape for the website. The sense of protection and uniqueness are emphasised in a calm space.
The ideal user persona is young and wants to surprise his/her partner with a visit to the capital.
Pain points are not knowing the language or locals places and having to deal with a restrictive budget.
Final goals are to book online an all-inclusive experience to enjoy with their partner for the weekend.
Site map highlight element that I wanted to include in the website such as booking process and call to actions to increase engagement during the user journey.
Alongside the UX research I was looking for the perfect typeface that would translate the sophistication and heritage of Paris in words. A Serif font was the best choice, and I opted for Garamond considered a major figure in French printing of the sixteenth century.
Here you can see different ideas that were explored from buttons to icons, accompanied with floral patterns and Eiffel view.
To grab the user interest and engagement a logo about Paris was needed: it should have been simple, immediate and eye catching.
From the beginning I wanted to combine the name of the city with its iconic building, the Eiffel Tower.
Sketching with pen and paper was a good exercise to explore different directions before realising the final logo: a sleek shape adaptable for multiple purposes with or without the name of the city.
On this occasion, I had to create my own low fidelity wireframes including an ideal user journey for desktop and mobile experiences.
Elements that changed during the process were the visual presentation of the menu, for a modern appearance, and the support section that was rethought as an addition in the menu.
Booking process is always accessible at the end of the desktop version while is visible at the top in the mobile for an on-the-go experience and to facilitate navigation in another page.
Filters are adapted on the mobile version for a core experience.
To create the visual brand identity I worked on how to recreate the presence of Paris on social media like Facebook, on gadgets for users while visitings malls with shopping bags, and on ads banner to implement in different cities (parks, tubes, walk-paths etc.) to increase audience awareness and promote the website.
Through a guide in the prototype, you can access the main areas that interest the user such as the landing page, plan your visit, accommodations, hotel page, book a room and payment accepted page.
From the image below you can see the mobile prototype while the desktop version is visible at this link: https://invis.io/FYR8RKNHP4E#/354795199_Landing_Page
This project was the perfect occasion to refine my skills as a UI and UX designer working in a city that intrigues me under every aspect. During a second review I would love to develop the areas that I couldn’t focus on for time contraint and bring to the next level the overall project.