Overview
The what
This project involved designing a compelling website for an accommodation establishment. As part of the project brief, we were required to choose a target group from various options as well. I chose to create a hotel website tailored for business travelers.
An essential aspect of the project was utilizing design tools to optimize and create a more efficient process. These tools were used for tasks like generating color palettes, genereate text, designing logos, and ensuring accessibility.
The why
Understanding a specific target audience is crucial for crafting impactful, user-centered designs. By focusing on business travelers, I aimed to create an online experience that aligns with their preferences.
Additionally, the digital landscape is rapidly evolving, with new tools and technologies constantly emerging and transforming what is possible. As an interaction designer, it's essential to continuously learn new tools and develop the ability to learn effectively.
The how
The project began with research into business travelers' needs, competitor analysis, and key features to shape a clear concept. The visual design, inspired by Scandinavian aesthetics, reflects the values of business travelers.
To execute the concept, I used tools and manual techniques, choosing which tasks to handle myself or outsource. Key elements like the layout, design system, and prototypes were crafted manually, ensuring control over aesthetics and functionality while refining my design skills.
Research & Conseptualization
This project involved designing a compelling website for an accommodation establishment. As part of the project brief, we were required to choose a target group from various options as well. I chose to create a hotel website tailored for business travelers.
Target Audience
This target group consists of persons traveling for work purposes, both individually and in groups, mainly on weekdays. They are primarily interested in what the hotel offers in terms of facilities and services, and they are less price-sensitive. Key values: appreciate quality, predictability, simplicity, and reliability.
Design inspiration
The design takes inspiration from Nordic and Scandinavian aesthetics, characterized by simplicity, functionality, and a strong connection to nature. Emphasizing natural lighting and elements inspired by the Nordic landscape, the design creates a serene and inviting atmosphere. These qualities resonate well with business travelers, offering a blend of comfort, exclusivity, and a refreshing sense of balance.
Name & logo
The name "SkyLight Hotel" refers to the fantastic light conditions in Scandinavia, whether it's the long, bright summer days or the spectacular Northern Lights in winter. Using ChatGPT’s Logo Creator, I designed a logo that highlights the hotel’s name while drawing inspiration from the clean lines and minimalist elegance of Nordic and Scandinavian design.
Location
As Denmark's capital and a central commercial hub, Copenhagen offers a blend of historical charm and modern efficiency. The city is ideal for business travelers seeking a unique Scandinavian environment.
Color palette
The color palette centers around deep blue and white as primary colors, embodying the essence of Scandinavian design. Blue is often associated with business, symbolizing reliability and professionalism—key values for business travelers. The use of deep blue enhances this connection, adding a touch of luxury and sophistication. White complements these qualities, and together they create a balanced aesthetic that conveys professionalism, quality, and exclusivity.
Competitor research
By analyzing competitors and their offerings, I gained valuable insights into developing SkyLight Hotel’s concept and website. This research helped identify essential amenities for all hotels, as well as those particularly important for business travelers, to ensure the website effectively highlights these features. Efficiency and tailored solutions are key for business travelers, who operate on tight schedules and prioritize convenience at every step.
Key insights for a business hotel website:
- Streamlined booking process:A fast and intuitive booking system with options for flexible dates, corporate rates, and package deals.
- Clear information architecture:Simple navigation to essential sections, such as meeting facilities and room options.
- Professional design aesthetics:A clean, modern design that conveys professionalism and thrustworthiness. Use of business-focused imagery, such as meeting spaces and workstations.
- Customizable services:Option to customize the stay in detail.
- Technology integration:High-speed Wi-fi and other important technology prominently advertised.
- Transport information:Maps and proximity informations to airports and train stations, and transport arrangements.
- Responsive design:A optimized mobile experience for on-the-go travelers.
Design Process
An important aspect of this task was incorporating time-saving tools into the design process. The rapid pace of digital development requires interaction designers to continuously adopt new tools and seek effective solutions. The choice of tools depends on individual preferences and competencies, with self-awareness playing a key role in understanding one's strengths and weaknesses.
Tools used in the project
In this project, I utilized a variety of tools to enhance efficiency and improve the design process:
- ChatGPT:Used to generate texts.
- DALL-E:Used to create custom images.
- Logo Creator:Used to create the logo.
- Unsplash (Figma Plug-in):Used to source high-quality, freely available images.
- Muzli Colors:Used to generate a cohesive color palette.
- Map Maker (Figma plug-in):Used to create a map for the hotel’s location.
- Contrast (Figma Plug-in):Used to check text-to-background contrast, ensuring optimal readability.
- Lucide Icons (Figma Plug-in):Used to source icons.
- Resizable Calendar with Prices (Figma Community Component):Used to display a calendar featuring prices.
- Figma and Figjam:Used to gather information and notes in one place, facilitate idea generation and brainstorming, and design high-fidelity prototypes and user interfaces.
Areas without tools
Some parts of the project I chose to do myself rather than outsource, as they align with my strengths and preferences, and provided an opportunity to improve my skills.
I designed the layout, hierarchy, and placement of elements manually, allowing me to experiment and find the best solution for the project. This approach lets me blend aesthetics with functionality while applying design principles like the "law of proximity" to achieve a balanced and user-friendly design.
I created the design system myself to improve my skills and because I enjoy organizing and structuring elements. Having personally chosen the colors, typography, and spacing, it felt natural to create the design system on my own.
Many of the prototype's components, such as navbar, footer, and cards, were crafted manually. This ensured the website's appearance aligned perfectly with my vision and conveyed the intended look and feel for the target audience.
The Final Design
This is the final design for the website of the fictional hotel SkyLight Hotel. The final design draws inspiration from Scandinavian simplicity and functionality while maintaining a professional and sophisticated aesthetic tailored to business travelers.
Try out the prototypes under the link below
The design ensures a seamless experience across all devices, with particular attention to mobile usability. Business travelers are often on the go, making a responsive and intuitive mobile interface essential for quick bookings and easy navigation.