Travel blog (RWD)
UX Research | UX/UI Design
About the project
The project was to create a modern, responsive site for a travel blogger to document his adventures and share his travel experiences. It was crucial that the site be simple, clear and convenient to use, allowing him to easily publish content in an attractive form. We chose a glassomorphism style that combines a minimalist design with light transparency effects, adding elegance and lightness to the site.
Used tools
Desk Research, UX analysis, Prototype sketch, Lo-Fidelity wireframe, Hi-Fidelity wireframe and UI Design.
Desk research
As a preliminary analysis, I reviewed both Polish and foreign travel blogs to understand the structure and typical elements of these types of sites and to extract best practices in their design.I analyzed blogs such as The World Travel Guy, Travel and Keep Fit, The Blonde Abroad, Ali Abdaal, Young Adventuress, Martyna Wojciechowska, Terra Xplora.
Key findings:
Readability and simplicity: The minimalist style, where black and white dominate, is particularly prominent on The World Travel Guy website. This approach makes the content clear and not overwhelming, and the photographs add dynamism.
Information overload: In blogs such as Travel and Keep Fit or The Blonde Abroad, there is a lot of information available, which can leave the user confused and feeling chaotic.
Color consistency: On most of these sites, light and muted colors (such as cream) dominate, but with skillful use of contrasting elements, creating a visually friendly interface.
UX analysis
The next step was UX analysis, based on inspiration gathered during desk research. I reviewed competing travel blogs that I had previously analyzed to see what solutions they were using to enhance the user experience. I examined how the various elements and features were designed for accessibility, intuitiveness and fluidity of use of the site. This allowed me to choose the best UX practices, such as simple navigation, clear sections and an eye-friendly layout, to ensure a positive user experience and an intuitive experience on my blog.
Prototype sketch
I then proceeded to develop a model of the blog, which I sketched out by hand. This helped me tentatively establish the overall structure of the site and plan the basic navigation before I evaluated the intuitiveness of the design.
Lo-Fidelity Wireframe
The next step was to create low fidelity wireframes, on which I pre-planned the detailed look and feel of the blog. At this stage, I focused on the layout of the main interface elements and the overall structure of the site, which allowed me to determine more precisely how the user would navigate through the blog. Wireframes helped me rethink the layout of sections, and design an intuitive navigation that would allow the user to consume content comfortably. This helped create a solid design framework as a base for further work on visual details and functionality.
Hi-Fidelity Wireframe and UI Design
The final stage was the development of the high-fidelity wireframes and UI design of the blog, in accordance with the principles of responsive design (RWD), which allows the site's appearance and functionality to adapt to different devices: computers/laptops, tablets and smartphones. This ensures that all elements of the site automatically adapt to screen resolution, providing a comfortable, aesthetically pleasing and consistent user experience on any device.
