Zoologico de Guadajalara
Guadalajara City Zoo
User Experience, UI Design, Illustration, Interaction Design
Goals:
- Mobile Application
- Online Ticket Sale (avoiding lines)
- Animal Information
- Local Maps
- Better navigation in place
- Enjoy more
Target:
People, who owns a bank account and a cellphone, also who enjoys outdoor activities
Tools:
- Illustrator
- Photoshop
- XD
- Procreate
My participation
This is a work in progress project from Alpha Wave Systems , I collaborated with them on multiple design areas, from UX and research, Mocking up drafts, designing Interactions and user flow interfaces. Also I did some work as illustrator using that old rotoscoping technique In procreate to bring the Zoo animals into a map.
Research for UX
Firstly, I looked at the place’s necessity to sell the project to the city zoo. I arranged a scouting as a tourist and took notes of things so I was able to point the owners where we were able to make improvements in a small presentation. After some approvals and adjustments, I did a second visit to create a user flow of the product, the result ended up in tree phases of the flow:
1. Preparing the trip, When the user has the plan of going to the zoo, will be able to buy tickets online, checks for the weather or other tips and finds the best route to get to the Zoo.
2.Accessing. After buying tickets trouhg the app, the user gets digital tickets which can be used to scan in the entry and access.
3. Navigation. Walking randomly is the average but having a digital map with annotations of all animals, places and facilities helps a lot. The map uses the device's GPS to constantly track the user in every spot of the Zoo, a great tool to search and find everything.
The Mobile App:
This interface was created according to the City Zoo color scheme, using shades and gradients of orange, green, brown and whites the UI attaches to the brand of the company. Then with simple iconography and illustrated leafs complements the feel as a kind of a jungle theme.
The photography were just added to present the project because we also created a custom CMS for the administrators to manage the application content.
- This is an example of the app
Launcher:
The Prototype:
Visual Flow
Here is a visual flow of all the screens required to have this App complete:
A Content Manager System.
To deliver freedom to our client, we build a web CMS to let the user change items in the app like photos, animals or attractions information, prices on their sale tickets and even moving elements on the map.
Map Illustrations
Illustrations of animals were drawn using a rotoscope technique be added on a custom map that was placed over the actual google maps ui. The custom map was created by a very cool 3d render artist, he recreated the map using scaled representations of the buildings, paths and trees; then finally added the animals illustrations and complete the navigational map
