A live video platform for discovering, socializing, and booking unique travel experiences. We want the user to "Be There", and see what the experience is really like. Gone are the days when users are fooled by selective company reviews and stock photos. Vignette puts you as close to the real thing as possible.

PROJECT DESCRIPTION

Vignette was an eight-month-long project that we iterated in the phases of the design process, from initial research to a highly interactive prototype.  

Vignette was especially designed to let travelers livestream their experiences, possibly tagging a business provider in the process, in order to document their vacation in the form of a video album and gain more followers within the platform. This user-generated content brings us to Vignette’s ultimate goal: Allow users to discover unique travel experiences through live video, while giving them the option to book the authentic experience they are watching.

Vignette is a comprehensive solution that exploits micro and macro moments, providing value to its users in all the phases of travel. 

VIGNETTE ON A MOBILE

The mobile version of the platform is optimized for live streaming experiences. These livestreams are broadcasted to all viewers within the platform. Additionally, users have the option to tag someone to notify them of their broadcast or simply share it with friends and family through their social media. 

To start a stream, users just need to type what they are doing or use “suggested tags”, turn the device landscape, and press “Go Live”. 

VIGNETTE FROM YOUR COMPUTER

The web version of the platform was designed with the planning phase in mind. Often when people are searching for their next holiday they naturally do so for more prolonged periods of time on their desktop. Users not only enjoy the user-generated content at its fullest but they also get more information about local vendors and bookings that are being livestreamed. 

Discovering new destinations, activities, and deals is easier than ever before since the app provides personalized recommendations on what to watch next based on the user’s behavior in the platform.   

2 MIN CONCEPT VIDEO

CLIENT & BRIEF

Turisram is a Portuguese investment holding with over 30 years of experience in the tourism sector. One of their subsidiary companies, More4You, is marking the incursion of the group from a Business-to-Business (B2B) space to a Business-to-Consumer (B2C) space with an online perspective. The brief they gave the design team was the following:

"Promote the experience of Madeira (Portuguese Island) in a dynamic and interactive way to reach the largest number of end customers through More4You domain". 

RESEARCH

Research covered the first four months of work. We used a variety of user research methods in order to gain a holistic understanding of the tourism market in Madeira through a series of primary and secondary research methods.

After we completed our various user research methods, we synthesized our data into findings by utilizing an affinity diagram to identify strong trends within it. 

• Existing Positive Perceptions: As a vacation destination that has been catering to tourists for a long time, Madeira is positively associated with a quality brand image of nature, good weather, relaxation, and seasonal attractions. Niche reasons bringing tourists to the island include its unique fruit and wine. We also identified a growing number of younger tourists incentivized by budget travel. With a changing demographic of younger tourists, we realized Madeira needs new, and not only more ways of promoting.
• Control: Tourists valued having control in various aspects of their trip planning. In particular, many of the current guests are willing to pay for high quality service as  well as control in having convenience in the booking process and activities.
•  Freedom: Tourists appreciate the freedom to discover authentic local experiences having the ability to take on the challenges to seek local experiences, having options of flexibility in activities, and getting away and disconnecting.
• Social Connections: Social connections enhanced a tourist’s experience by making it more personal and memorable. In particular, they valued interactions with locals and meeting other travelers during their trip.
• Informational Needs: Tourists had immediate they expected to be met while traveling, especially while engaging in activities such as hiking on the island. During the planning phases, tourists felt more comfortable using familiar sources of information such as domestic website, trusted global sites, and word of mouth family/friends to obtain information. Many of the tourists had frustrations on the island with the transportation, noting it was inefficient, inaccurate, and confusing. 

SYSTEM DESIGN

Based on our insights, the team started ideating with a clear set of design goals. We want to provide immediate, relevant information to tourists as they are performing their activities through contextually aware services. We also want to encourage tourists to travel deeper to learn more about their destination and the people there. Ultimately, promote new ways of seeing Madeira, we want to enhance how users perceive an authentic travel experience. 

We started sketching our ideas, having groups discussion, "yes, and..." improv sessions, to visualize and explore several potential solutions. Once the idea of the live video streaming started to take shape, we then held multiple focus groups to further explore the idea and then validated it our users and potential business partners soon after.

WIREFRAMES

All the first low-fidelity iterations were made in mobile first, and with the intent of testing specific interactions with the app. The web version of the platform would later be designed in the future high-fidelity phase of the project.

USER TESTS

We took our first high fidelity prototypes to potential users in Berlin, Germany. We tested with locals and asked them to think aloud about how they would use the platform while at home and when at their traveling destination. Our users responded with a strong interest in the platform, and discussed scenarios in which they could see themselves using Vignette. These sentiments validated a lot of our design decisions that we made as a result of prior user testing.

We also asked them to complete specific tasks while thinking out loud to assess and refine usability. From these studies we were able to fine tune the high fidelity prototypes. 

PROTOTYPE

INTERACTIVE PROTOTYPE

We delivered three interactive prototypes (two for mobile and one for web) that show different flows of the platform. Unfortunately, the Framer prototypes when uploaded to the Framer servers at times do not show the videos. For that reason, it is recommended to download the prototypes (only if you have the Framer application installed in your computer) to have the complete experience.

Web Marvel Prototype: Vignette's Web Experience › 

Mobile Framer Prototype: Vignette’s Broadcast Experience ›

Mobile Framer Prototype: Vignette’s Enjoying a Broadcast › or featured below

PROJECT SUMMARY

Owner – Turisram S.A. 
Status – Interactive Prototype
Team – 4
Time Length –  8 months
Methodology – Contextual Design

PERSONAL CONTRIBUTION

Role – UX Designer / Prototype Lead
Responsibilities – 
User Research
Interaction Design
Prototyping

METHODS & TECHNIQUES

Contextual Inquiry
Interviews and Surveys
Competitive Analysis
Concept Validation
Paper Prototypyng
Ethnography
Card Sorting
Low and Hi-Fi Wireframing

TECHNOLOGIES

Sketch
Framer
MarvelApp
Balsamiq
Illustrator