I chose the option below, but all the topics are really exciting and I will do these exercises later with no time constraints applied to those exercises.
(Option 1)
Many hotel chains are starting to have key less entry programs, allowing travelers to use their phones to check in and out without having to stop by the front desk, and open the hotel room with their phone. Design a secure digital experience for a guest of such a hotel, which will allow him to have a personalized valet parking experience, check in and out, find his room and open it with the phone in one seamless guiding experience.
PHASE 1: THINK / ITERATE.
ADS (Application Definition Statement): Application designed especially for the guest of the hotel to have a personalized and secured digital experience, guests would be able to manage checkout, secure (open / close) the door and have access to many services that hotel provide using this app.
MAIN FEATURES LIST:
- Login
- Key less Entry.
- Valet Parking (Find my car)
- Hotel Map.
- Live Chat with Front desk.
GOOD TO HAVE FEATURES AND LINKS:
- Smart Search
- FAQ
- Wake me up
- Discount Coupons
- Special Event Information
- Booking amenities
- Hotel Information
- Restaurant Menu
FEATURES AND APP CYCLE EXPLAINED:
# Opener: Splash screen with welcome message and logo in the center, with beautiful images of the hotel running as a fade in/out presentation at the back.
# Login:
On the main screen a default option will be displayed asking the following information
STEP 1
First Name
Last Name
Or
Credit Card Number
Or
Reservation Number
Followed by a [Retrieve] button
STEP 2
Other links at the bottom will ONLY be active after successful retrieval of the guest’s reservation.
# Keyless entry: Now when all the links are active, guest can directly move to his / her room and open the lock using the 2nd button on the app as explained according to the screenshot below.
# Valet Parking: It is advised to activate the hotel app prior to reaching the hotel and before handing over your car keys to valet so that valet knows the room number of the guest and can update the parking number on hotel’s system, which later on sync up with the app and keep the guest updated on the parking number where their vehicle is parked. App will always be in sync with the system of hotel and guest has an option to either retrieve their vehicle themselves or request valet to bring the vehicle in the front of hotel’s exit using the phone app.
# Hotel Map: No two hotels are alike and guests can get confused or lost sometimes looking for various amenities or restaurants that hotel has on offer, a live map (if possible) indicating the current position of the guest and their target destination will be shown, which a guest can follow and reach their destination. It should work exactly like Google maps, but at a very small scale, for now I will add the blueprint or directional map.
# Live chat or assistance: Instead of dialing 9 from their hotel room while the guest is in the hotel / room, guests can ask an answer to their question, check the availability, make a reservation instantly using this function. Another example where this might come handy is a situation where guest is out of the hotel meeting to with their friends/ business and they plan to eat out, but realizing that it’s late and nearby restaurants are closed for the night. Hotel guest can go on to the chat and ask if restaurants in the hotel are also closed (as per my experience, hotels inside the restaurant close much late than the ones in the city) Guest should be able to ask for a cab to come and pick them up from specific location (If required)
OTHER FEATURES / CALL TO ACTION EXPLAINED
# Smart Search: Self-explanatory, to be placed on the top, right next to the hamburger menu.
# FAQ: Self-explanatory, sometimes a question is too silly to be asked, or is often asked, to negate the repetitiveness, Frequently Asked Questions list is prepared with appropriate answers. Hotel can update the list of questions.
# Wake me up: Or a reminder feature, it’s very much prevalent feature in Middle East but I am not sure if it is used here, please feel free to scrap it off. All this will do is work as a reminder notes which are sent to front desk, it’s like a wake up call or an alarm. I personally have never used it but good user experience has to accommodate everyone.
# Discounts: Although these offers would be a part of main interface but to get the list of all discounted services, guest can click the link and will get to know all the discount schemes available.
# Special Events: Just like discount, guests can know the latest and special events taking place in the hotel.
# Book Amenities: Guest should be able to schedule and book various amenities hotel has to offer, for example a session with a trainer, swimming coach, snooker / pool tables, table for a number of people in a restaurant. (This phase will be a separate application in itself but for phase 1, we can have simple drop down menus with amenities on one side and calendar booking option on the other.)
# Hotel Information: Time to brag, copywriters can fill up this area with good information about the hotel.
# Restaurant Menu: I have seen great restaurants giving birth to a hotel and vice versa, some hotels are known for their internal restaurants, in this option a guest can view the interactive (Breakfast, Lunch and Dinner) Menus of all the featured restaurants with timing, ability to book a table in advance or even order food to their room.
MENU INTERACTION:
On taping over the hamburger menu, current page will tilt and shift on to the left, exposing the sub menu items.
PHASE 2 : IDEATE, DEFINE APP FLOW
Following is the Final sketch I drew to define UI elements placements as well as the flow of the application. I drew many interactions but this one was final as it gave me a good foundation to start.
To save time I just created the final screens for a part of application, I would complete the drawings for other user flow using pencil and paper for a real time app request.
PHASE 3: (VISUAL) BRANDING, MOOD BOARD, APP DESIGN IDEA and APP ICON DESIGN.
LOGO DESIGN
Before logo design I took on to search an appropriate name for the hotel, after the research and choice of location, type of business model (business and pleasure) I chose the name “DOWN TOWN HOTEL” Located in the business district where people come in for business meetings
Following are the ideas and different rough sketches for the logo. I laid stress on the alphabet “W” and wanted to use them as down arrows as a unique shape / symbol.
I ended up with the final logo creating a bit of negative spaces W and highlighted W in a different way, I made sure that logo structure remains of a rectangle.
MOOD BOARD
Upscale, business and pleasure style hotel. Hotel management wanted to maintain a rich, yet subtle and calming feel to their identity, so I chose colors and fonts accordingly.
COLOR THEORY BASED UPON THE MOOD BOARD ABOVE.
Above colors and their shades will be used in the app design.
APPLICATION ICON DESIGN
Adhering to the colors and subtle aura of the app, icon is designed with flat style in the colors from chosen pallet. The iconic W is used eyes of the bag.
APPLICATION DESIGN
App will be designed for iPhone 6Plus using 750 X 1334 PX following even number division sizes for @ 2x and so on.
UI ELEMENTS / IMAGES
All UI Elements / icons / buttons are vector based smart objects, images used will be high-res.
SOFTWARE USED
As I own a windows based system right now, I don’t have an option of using Sketch, I will be using Photoshop and Illustrator (design icons) but would have preferred Sketch over Photoshop to design an app because of many useful features, such as exporting artwork with east for both Android and IOS platforms.App will be designed for iPhone 6Plus using 750 X 1334 PX following even number division sizes for @ 2x and so on.
FINAL DESIGN SCREENSHOTS
Flow of the app has been discussed above.
Guidelines Met:
Low Fidelity overview of proposed UX: Sketch is drawn and shared in the document, I must admit that I took some new decisions when I finalized the design.
A high-fidelity mockup for two screens plus interaction callouts, including interaction specification and specifications in regards to the native UI for the mobile platform you pick (colors, fonts, spacing, and asset dimensions)
I tried to finish the whole application and did stretched out some of the IOS Guidelines but only after seeing the live apps examples, I have also tried to showcase my whole design process but it’s just not possible without a real client. As real client will have their own taste, like / dislikes, pain points and aura they want to obtain with their visual elements. After designing mood boards, next step is to design an elaborate style guide… I designed a mini style guide and called it a mood board for this exercise, usually style guides are of 3 main tastes, subtle, aggressive and the mix, After my experience of interacting with the client I always design the mix version just what the client wanted in the first place…other 2 versions are just to help me pave the path toward the mix.
Any annotations or specific features you would like to call out, please do so. Also, please walk us through your design thinking/process, so we can understand your design since we are reviewing it remotely.
I have viewed few applications which act as a key to a hotel door. Those applications require the phone to be near the censor and no other interaction is required, which might be convenient to some, but for someone like me who often drive back around to check if I accidentally left my garage door open, or I pressed the button twice. I am sure there are many like me, so I wanted to add a unique feature of swiping from left to right, just so that the process would be registered in my mind. A small swipe of a thumb can re-assure the guest even before taking the phone out of their pockets to check the current status if the door is locked or unlocked (This is the second feature other applications do not have) I often have too many things on my mind and have been at a fault of leaving the door open. The control on this application will not only register information, but will also let me check the current status of hotel room door.
I also create brief documents which help me manage and work with teams of different offices / countries.
Live Link for this App
Thanks, Hope you liked the journey
