UI/UX | Web Design | 3D Rendering
Project
Panda Pod
Client Info
In my collaboration with the owners, Creative Director, and Interior Designer of Panda Pod, a unique Pod-style hotel in Richmond, British Columbia, I helped to refresh their brand and improve their customer experience by rebuilding their website and creating a new App. As a 3D artist, I also played a role in bringing the hotel’s new look and feel to life by pre-visualizing the interior and exterior spaces to match the Interior Designer’s vision. The end result was a modern and user-friendly platform for booking, payments, and other features, providing guests with a convenient and affordable alternative to traditional hotels.
Role
UI/UX Designer
Web Designer
3D Rendering
Software
Adobe XD
Photoshop
Illustrator
3DS Max
Vray
Details
2020
App Design
Web Design
3D Pre-Viz
March 2020
The Challenge
- Tight 4 month schedule working with an all new team
- Design a new web site around the established branding guidelines
- Design a fully featured app that allowed for 3rd party integrations
- Work with the Creative Director to integrate marketing campaigns as well as look and feel into the app and web design.
- Work with Interior Designer to create 3D Models as well as renderings of the planned upgrades to the hotel’s interior and exterior.
My Role
For this project my initial and primary role was to design the web site and app. Being one of the first on the team I established the project management tools and systems for the development of the project as other team members would be brought onboard. Over the course of the project my role expanded to also include the 3D design part of the project as there was a need to visualize the interior designers vision from the rough mock ups and floor plans.
Creative Process
I start projects by establishing what the needs are of each part of the project and what the target audience will be. This project had three main sections following their refreshed brand: primarily, the web site re-design, followed by the complimentary app design that worked in sync with the site, and lastly the 3D rendering of the future hotel design that will be used for marketing applications.
This being a 3 part project certain elements were done in parallel such as the web and app design. This helped in keeping a consistent look and feel as well as a consistency in the user interaction between what features are available on the app vs the web site.
Time Management
Our project management tools of choice were Slack and Asana which everyone was quite familiar with.
User Testing
Testing was ongoing and done internally with the team to determine what worked and what didn’t.
Market Research
Research was done early in the project with both other apps and what the user was looking for in usability.
Team Management
This being a small and experienced team it was self managed. Having weekly meetings for updates.
PandaPod App Features
The App itself had three priority features which would be rolled out in phase 1, ability to check-in and check -out. Ability to reserve a pod and lastly to create a user profile which contains the users account information. For phase 2 several other features would be added such as a exploration feature to show points of interest in the surrounding area, a concierge service, special offers from local businesses and a game which merges exploration and business marketing discounts similar to Pokémon GO.
Minimal Consistent Design With Web Site
Booking from the App
Check In / Check Out in advance
User Profile
Exploring the neighborhood feature
UI / UX Design
The UI design in both the app and the website was to reflect an already established brand guide and keeping with that along with a minimalistic and clean design.
There was a bit of a learning curve in understanding the full functionality of a hotel based service. The UI design went through several iterations once some testing got under way to test the flow and functions of the app using XD. After testing several ideas with navigation and which worked best with the colors and flow a final version was established.
WEB DESIGN
Designing the web site was started first to establish the look and feel which would be carried across to the app in certain sections. Working closely with the creative director as well as the client the flow of the site was broken down first based on specific features which would be needed, followed by a mock wireframe of the flow of the site using Adobe XD. The site went through several iterations before a finished version was created fully functional in XD prior to being handed off to the developer.
3D Rendering
Another part of the Panda Pod project was the re-design of the interior and exterior of the hotel. I was tasked to work with the interior designer in coming up with 3D models and renderings which would be used in the construction of the new look of the hotel.
Working from 2D plans as well as rough mock ups provided by the interior designer I built out the entire hotel using 3DS Max and VRay. This helped to visualize the design and allowed for tuning and moving things around before final construction was to take place.
Result
Panda Pod was going through a major relaunch while closed during the pandemic. Having worked closely with the client as well as the team there were few bumps if any that were quickly resolved. In the end the project was completed in approximately 4 months during which the website and app went to the developer in the last quarter of the timeline.
Let’s Start Something new
Say Hello!
Send me a note if you’d like to discuss a service or collaborate on a project.