Web & UI\UX
Design Projects
Hybrid Approach
I combine marketing and design together for better results.
Pandemic Support App
Target used: Local and international visitors.
Sector: Travel, Entertainment, and Social.
My Role: Research, Entire Product Design, UI Style, and Visualization.
Tools: Figma, Adobe Creative Suite and Adobe XD.
Location: Vancouver, Canada.
​
Problem:
​
Since the COVID-19 pandemic started, the situation has become unpredictable with lockdowns, restrictions, capacity limitations, closures and opening of new businesses every now and then. In most of the cases this data is hard to verify online because some platforms such as Google map cannot keep up with the rapid changes. Hence, tourists who are not familiar with the city are misled by online platforms making their experience unpleasant.
Solution:
​
VanOpen is a concept app developed by myself during my online training at The California Institute of Arts. This app is specifically designed to support Vancouver’s tourism industry during and after the COVID-19 pandemic. The application will guide and assist tourists during their visit in Vancouver by providing them with up to date information which is going to be aligned with local recommendations and restrictions.
​
Goals:
​
-
Help the City of Vancouver to recover from the COVID-19 pandemic
-
Guide tourists based on Provincial and Federal restrictions
-
Increase traffic to local or small businesses.
Research:
​
Since Canada started major lockdowns, I realized how frustrating it is to find updated information about local businesses, public parks, and local health mandates. Specifically, hours of operation,business capacity, infrastructure modifications, closure of facilities, etc.
Therefore, I have conducted exhaustive online reach and interviewed a few neighbours, and visitors who live and stay in Vancouver and I found out everyone’s experience is very similar, we all have the same question:
“ What is open? ”
Tourists want to enjoy their time while in the city but the data in Google maps or Apple Maps is inaccurate or slowly updated. Google search engine is also a compilation of both updated and outdated information. Hence, looking for something simple as mask requirements can be tricky.
Key insights from the research:
INSIGHT No. 1
​
Visitors can’t find accurate information they need to go to outdoor or indoor places.
Local or International tourists face difficulty finding information about places they want to visit because that data is not available or inaccurate due to the unpredictability of the pandemic.
​
INSIGHT No. 2
​
Visitors don’t have the time to do the research.
Most visitors have limited time and are also usually exhausted from traveling and going through the covid-19 protocols. The best way to find up-to-date information is to research on the official provincial website but it is time consuming and the language of those sites is very technical.
​
INSIGHT No. 3
​
Locals are also confused.
Whenever there is an outbreak or rise in covid-19 cases, the provisional government acts rapidly. Restrictions can be in place from one week to another. Making it even hard for some locals to actually give advice to any visitor.
INSIGHT No. 4
​
No ultimate platform to check out information.
​
Almost everyone I interviewed said the best way to obtain official information was from Google search engine and Google maps, however everyone agreed that the information is not regularly updated by both google and local businesses.
​
Criteria filter:
Target audience:
Local tourists: Canadians or permanent residents from other provinces who are still uncomfortable about travelling abroad. They might have visited Vancouver before but they want to experience new adventures and enjoy the natural wonders of British Columbia.
Foreign tourists: People from a variety of countries. They usually speak other languages and English might not be their first language, most of them come for less that 2 weeks. They are not too concerned about COVID-19 but want to follow the protocols .
​
​
​
PERSONA No 1
​
Foreign tourist:
Maria Hernandez is visiting Vancouver from Costa Rica, her mother language is Spanish but she is able to speak basic English. She is 30 years old and is visiting with her boyfriend for one week.
Objectives:
-
Visit the most popular landmarks in vancouver.
-
Go to a museum and learn about Canadian folklore and culture.
-
Visit scenic places.
Frustrations:
-
Language is a barrier and it is taking a lot of time to research and make reservations.
-
She is not aware of all health mandates in indoor places.
-
She realizes that business hours in Google maps are not updated and capacity is limited in some national parks.
PERSONA No 2
​
Domestic tourist
Thomas Langlois is a domestic tourist who is visiting Vancouver from Montreal, he decided to travel inside of Canada to avoid travel complications. He is 25 years old and his first language is French and second one English.
Objectives:
-
Go for outdoor adventures and get the most of his vacation.
-
Quickly have a taste of the local cuisine and culture.
Frustrations:
-
Some outdoor activities have capacity limitations due to covid-19 restrictions.
-
He doesn't know if he needs a provincial vaccine card to visit restaurants
-
He doesn't know if certain events have been cancelled.
User Journey:
Taking the personas as reference I analyzed how they think and behave when planning for a visit to Vancouver. Below is a user journey focused on domestic visitors.
Sitemap:​
Wireframes:​
Motion exploration:
UI style guide:
Verso Handcrafts:Online Store & Site
Verso Handcrafts was a company that sold products and jewelry online (to learn more about the project go to the marketing section). Its business was completely online.
The challenge was to create a website that is responsive and able to process and place orders in the most intuitive way. The design of this website uses a flexible layout, photography for online shopping, and designs that keep to brand guidelines, all while with reasonable loading speeds and performance. Online commerce should be fast and easy. Take a look to the website:
Revive Homepage
​
Background:
​
This project was originally an assignment for AlgaeCal which consisted in reorganizing and redesigning the homepage. Logos, fonts, colours and images were changed in order to avoid copyright issues with AlgaeCal. This project was just a proposal but it shows my web design skills and best practices as a web designer. Click on the following button to see the online mockup which is also responsive.
Fresh Start: 3D Animation Applied to Web
​
Fresh Start Finance is an online application that offers personal loans to Canadians. Its website has a clean and minimalist design. My job was to animate certain elements and assets that are being used in the site such as the laptop animation. The project required knowledge in Maya, Adobe Premiere, and After Effects.
This project was developed in summer 2017 with the supervision of an Art Director. This is an example of teamwork where every individual contributed to the improvement of the website.
​
I had the opportunity to work for Canada Drives, which is a company that helps thousands of Canadians purchase a vehicle by offering auto finance options for people with good, bad, or no credit. Canada Drives has an online application with different sources and animations. My job was to design, prepare, and animate many components in the website, taking into consideration loading speed and functionality. The mock-up below is from the 2019 version of the app.
For more samples of my work,
please send me an email.
