Hotel booking website
Vivastay (vivastay.com) is an independent travel operator providing worldwide accommodation with a strong focus on customer service, Their vision was to establish the company as a leading travel operator, targeting particularly young people and couples aged 20-35. Due to low budget and very limited time constraints, some UX activities were not performed.
Due to these constraints, we were forced to ﬁnd out a solution with the data and tools we got. First of all, usability tests on 3 users and reviews of analytics were used to get a general idea of the website performance. Users were given a speciﬁc task to complete. Frustrations were observed and noted. Measurement was recorded of how efﬁcient, effective and satisﬁed the users were during the sessions.
Test report: the main findings
Tests were conducted by the with me and internal team.
- Poor conversion rate (Google analytic)
- Overall look and feel outdated, inflexible and did not give necessary conﬁdence to a user
- Participants were not clear what stage they are in, during the purchasing process (only one participant completed the task)
- Majority of users could not differentiate clickable areas with other parts of the website (”Do I click on text or image?”)
- Photos were too small, generating problems with users choosing the wrong hotels
- Forms unclear and confusing
- Improving the number of site visitors who contacted the company to make a booking
- Pleasant online experience and updating the site to be robust, flexible, international, elegant, and easy to use.
- Delivery of the product on time and tight budget (only a developer were assigned to work alongside me)
Information Architecture and Content Strategy
We dedicated one day for an intense period of ideas generation. We had lots of thoughts on how to improve online conversion and we noted everybody’s ideas. We went through several activities to document these ideas, spent a lot of time sketching and surrounded ourselves with printouts of competitor sites. We focused on key user tasks for the new website.
The next step was to establish the main user journey (red route) and to ﬁnd out how users would interact with the product. Existing screenshots with some quick Photoshop editing were used to map the interaction and low ﬁdelity wireframe mockups were generated to understand how the content will be organised.
Wireframes were produced to quickly fabricate the model.
05. Visual UI Design
After additional ﬁndings from user tests, further improvements were made on wireframes and ﬁnal prototype was delivered. I worked with the stakeholders to understand the essence of their brand and the online presence the new site should reflect. It was important that new design ﬁtted seamlessly with the brand and reflected trust, value and youthful appearance. The new website was radically different from the old version, but stakeholders were very happy because it distilled the brand personality they were aiming for.
Designs for mobile and desktop screens were created. After they were accepted, the development phase has begun.