UI and Banner Design for Gallop Global

Introduction

This is the UI and UX design that I did for Gallop Global. The Gallop Global is a Chinese based travel agency located in Quincy, MA. The client wanted a clear and aesthetical user interface design and a usable user experience website increasing visit to order ratio. Their customers mainly focus on Chinese, so the language of this website is mandarin.

What Did I Do?

UI Designer | UX designer| Interaction designer | Brand strategist | Visual designer | Graphic designer | Illustrator  

I worked as a UI designer helped them with updating company brands and create a new website. For the UI design, I’ve worked with the web developers and back-end developers. Since it is a start-up travel agency and with the budget limit, the main features have almost completed and some functions were under construction when they published it. You can check the live view in here: https://www.gallopglobal.net/

Because it is a travel agency, I designed the website with many travel illustrations and graphics to show some fun and engagement, for example, I designed the icons, banners and graphics with identified locations landmarks. I created the beautiful tourist banners to engage with users and for them quickly knew the trip content.  I used eye-catching color theory by using the orange color to design the prominent call-to-action button, such as buy and view trip detail.

As for the interactive effects, such as hover, magnified and popup effects, I designed them to serve the purpose of fun and engage purpose.

User Feedbacks

The website has hit a big success. It increased the agency’s profit by 49%. The design was appreciated and honored by the CEO of the Gallop Global. I had built a solid relationship with them. They even hired me to work on many other design works. The people who visited the website had 90% positive feedback about user interfaces and user experience. The website design achieved its business goal and increased customer retention.

 

Here is the overview of the UI design for this website.

The following are some details UI design for the web pages.

this is feature parts showing on the homepage. It is used to tell users what feature services that they have. I used a stair align design.


Here is the slideshow displayed on the homepage. It is to show the features tours which start from Boston. I used a Boston scenery photo as the background and add a transparent layer on and to bring more contrast from the main contents.

This part shows tour categories. Their tour services are around global, so they have four categories–Asia, Europe, North American and Other places. I designed this part with featured icons and featured web background. I sketched four different scenery icons to show the four categories and illustrate a global background.

In this part, it is a detail page to display the details of the tour product. The left side are picture slideshows. The right side shows the price per person, tour duration, tour schedule and so on. I designed a very clear and call to action orange button to show the buy now.

This part is a product display page, which shows filters and all the tour products. For a better UX, I designed the filter in the top. Also, a big orange call to action button on each tour to ask visitors to know the price and view tour details.

In this area, it shows the details of each tour. I also used the icons to design the UI and keep consistency. The icons show location, scenery, details of tours and restaurant and so on.

Some other views for the web design

Here are some banners that I designed for displaying at homepage slideshow. Each banner shows a scenery of different places.