Role
UI DesignerDuration
8 weeksTools
FigmaIllustrator
Photoshop
Skills
PrototypingVisual Design
User Interface
OVERVIEW
Hotello is a user interface design for a hotel booking application developed for my Visual Design class at Kennesaw State University. The prototype aims to evoke the comforting experience of arriving at a hotel as night falls, emphasizing the reassuring glow of hotel lights guiding guests to their destination. This narrative of warmth and safety is the cornerstone of the Hotello design.
A safe hotel reservation app
Hotello is a user interface design for a hotel booking application developed for my Visual Design class at Kennesaw State University. The prototype aims to evoke the comforting experience of arriving at a hotel as night falls, emphasizing the reassuring glow of hotel lights guiding guests to their destination. This narrative of warmth and safety is the cornerstone of the Hotello design.
/ 01
Utilizing Variables
To enhance adaptability, I leveraged Figma’s variable system, allowing me to create a responsive design that works seamlessly across different screen sizes and modes. Key features include:
- Multi-Device Responsiveness: Developed layouts for desktop, tablet, and mobile, ensuring a consistent user experience across devices.
- Auto Layout and 8-Point Grid: All components follow an 8-point grid and auto layout properties, ensuring scalability and consistency in design.
/ 02
Prioritizing Consistency
Consistency was a key principle throughout the Hotello project. By utilizing reusable components and Figma's variable system, I ensured that design elements remained uniform across all screen sizes and modes. This approach enabled:
- Visual and Functional Consistency: From buttons to typography, every design element was systematically aligned, creating a harmonious user interface.
- Scalable Design: Ensured that the design could be easily maintained and scaled for future updates, minimizing potential discrepancies during development.
/ 03
Ideation and Interation
The design system for Hotello was established early in the project, which provided a solid foundation for further refinement. As the design progressed, I focused on continuously improving the UI by iterating on assigned pages and components. During this process, I kept several core principles in mind:
- User-Centric Design: Designed with a focus on presenting information in ways that maximize clarity and value for users.
- Design Heuristics: Applied fundamental usability principles, ensuring that the interface is intuitive, accessible, and engaging.
- Iterative Improvement: I regularly revisited and enhanced the design based on feedback, ensuring that the solution addressed both functional and aesthetic goals.
/ 04
Simplifying User Flows
Simplicity was key to creating an intuitive experience in Hotello. I aimed to keep user flows straightforward while introducing small, delightful interactions to make the experience enjoyable. Some key strategies included:
- Streamlined Interaction: Simplified the process of tasks like hotel check-in, allowing users to complete them effortlessly.
- Minimalist Design: Focused on reducing visual clutter, using only essential elements to guide users through the interface.
/ 05
Conclusion
Hotello was one of the first full-scale visual design projects I developed in Figma, making it a pivotal part of my journey as a designer. The project allowed me to explore the intricacies of storytelling through visual design, using a contrasting color palette to enhance the user’s emotional experience. This project solidified my passion for crafting enjoyable, cohesive, and user-centered interfaces. Designing an entirely new interface from scratch was a unique challenge that helped me grow creatively while understanding the users' needs in an adventurous, engaging context.