Case Study 1

Search Redesign

Goals

  1. Improve User Experience (and thus conversion) by providing a facelift to the existing journey

    • Metrics: Revenue per Unique Visitor, Lifetime Value per Customer

  2. Provide comparison shopping experience to de-duplicating listings

  3. Improve key features such as filtering, scrolling, and dates entry to improve traffic quality coming from Tripping.com to our metasearch partners.

  4. Better support user (and native ad partners) by providing a real time search service with a new lazy loading UX.

Opportunities

  1. Clean up visual design for clarity, usability, and give the experience a facelift

  2. Investigate with real users where UX was lacking, beyond obvious low-hanging fruit.

  3. Create a flexible, device-ready UI that would allow iterative expansion and reusable units.

Before

Before

Jan 2017

Jan 2017

The Team

As the sole designer for this start up from 2015-2017, I worked directly with Co-founders Jen O’Neal and Jeff Manheimer, while collaborating closely VP of Product, Colin Gardiner, as well as engineering leads and contributors across the product design work.

For user research, I worked closely with Tyler Swartz, Product Manager, as well as Anne Harris, one of our product marketing associates.

For visual design, persona definition, and look and feel in Q1 2017, I collaborated closely with our VP of Marketing, Michael Lattig, and founder Jen O’Neal.

 

Research Process

This research was conducted alongside product managers, performance marketers, and engineers.
As discoveries were made, user stories would be backlogged and prioritized for various design & engineering sprints.

  • Audit product UI & conduct Heuristic Analysis to identify problem areas within the site.

  • Identify user groups & conduct behavior survey with 500 participants who used vacation rentals in the last year.

  • Research 1:1 with 15 individuals to get an understanding of existing issues within current product.

  • Identify traffic sources and marketing channels with the marketing team.

  • Organize user feedback, problem statements, and feature ideas by complexity & Impact

If I could wave a magic wand, it would be an experience that gives me just 5 of the best results.
— User Interview
 

Design Execution

This project required a few concurrent design efforts. On the one hand, we had a new technology we needed to support with an updated ui, while minimizing structural changes as to not disrupt the SEO framework that the operation relied on. On the other, we needed to build a net-new front end, so an entire UI system needed to be created to support our development team.

Design Approach

Screenshot 2019-05-18 18.52.37.png
image_preview (2).png
  • Define visual identity for brand and UI systems.

  • Simplify key workflows and simplify information architecture.

  • Explore and rapidly iterate on key feature interactions.

  • Generate rich prototypes and high-fidelity concept mocks for fundraising efforts.



Deliverables:

User Flows, Wireframes, High fidelity mocks, and Prototypes.

  • Micro-interactions including date range selector, filter bar, map markers.

  • Animations & CSS specifications .



 

Card Exploration

Multiple design iterations went into listing card layouts to increase the size of photos, allow for a scannable overview of pricing per partner, and still allow a comprehensive overview of multiple listings. Qualitative testing allowed us to iterated on a higher level, and card variants were a/b tested once enough real traffic was supplied to the v2 environment to provide meaningful results.

SRP - List view.png
SRP_Card_ABTests.png

Filter UX

User testing taught us that filtering was critical to the quality of the traffic we were sending to our off-site booking partners.

Our research taught us many visitors experience sticker shock on short-term rentals as many are booking trips on average 7-10 days at a time. Users told us they are looking for price savings, and have a hard time spotting a bargain they like.

We wanted to incorporate a scatter plot of pricing alongside our price slider using real time price data to give users an indication of the average price in a market. Users can hover over the slider to see the frequency of listings by price per night so they can better know what to expect.

Multiple variants of filter layouts were tested for usability on Usability Hub. Over 500 users were surveyed.

filters.png

Mobile UX

mobile.png

The mobile UX focused on giving an overview of information and very clear filtering UX. We learned in interviews that there was little value in supplying hundreds of results, instead people were asking for the 5-10 most relevant, highest rated homes.

 

Outcomes

On the original search experience, users searched longer and clicked on more results, but converted poorly for our partners. 

In our v2 search experience. users had shorter overall search time, but visited more pages of results and clicked less, with significant improvement for parter-side conversions because users were more likely to enter their trip dates.

Searches that included at least one filter beyond dates also increased significantly, telling us that filters were much more discoverable in v2 when compared with v1.

Overall, Revenue per Unique Visitor performed consistently higher on v2, while conversion improved significantly on the partner side after the introduction of Real Time and encouraging dates entry. 


 

Concept mock for destination information

 

Case Study 2

Instant Booking

A real time service with a responsive front end framework means new things for mobile.

Before

After - V2

Instant Booking v1

BookingInstantlyonTripping.com.png

My first project when joining Tripping.com was to help the team finish up an instant booking experience. At the time, booking a vacation rental could take 3, sometimes 4 days as many vacation rental owners did not accept online payments and required booking by phone. Tripping had a unique deal with Booking.com to pilot a program with their new instant booking API, so we created this experience with the constraints of: 2 weeks to deployment and leveraging the current UI.

Desktop HD.png

The V1 booking experience was the first mobile-friendly feature launched on Tripping.com and launched in mid 2015.

Constraints:

Instant Booking V2

With more partners providing opportunities via booking APIs, and our move toward real time search, we had a chance to overhaul the booking experience with mobile in mind.

Mobile Booking UX

mobileonsitebooking.gif

Property page redesign focused on allowing large images, expandable information sections, and a 3 step booking process: Click, review, submit.

User interviews told us that upfront the most important thing we can do is show a clear, transparent breakdown of the final cost.

Because short term rentals are booked for long periods of time, usually between 7 days & 3 weeks, the purchase is collected in part. Every deal is structured uniquely and required a flexible display dynamic enough to adapt to different payment schedules.

Outcomes

As we geared up to launch our mobile booking UX, our marketing spend ROI had been taking a hit due to a lack of mobile support. After launch, ROI stabilized, while mobile searches, and bookings, increased.

We changed our results sort order to improve the user experience, weighting higher onsite bookable, mobile friendly partners up front, and we saw a huge improvement in our revenue per mobile visitor. Mobile conversion increased by over 20% steadily as improvements were made.

Over the first quarter of 2017, Tripping generated over $1MM in instant bookings after the roll out of these features.