📜 ⬆️ ⬇️

What is wrong with air service interfaces # 2: How Aviageek changed after the post on Habré



In the past topic, we talked about how our project Aviagik solves common interface problems of air services. The project is in the prototype stage, so feedback is valuable to us as nothing else. The audience of Habr did not let us down - the material received a great response and gathered more than a hundred comments, the authors of which expressed their wishes for the interface and talked about which solutions they did not seem to be the most successful.

We carefully analyzed the feedback received, created a new version of the interface and today we present to your attention the final prototype of Aviagik before the direct launch of the service.
')

New interface


For the most visual demonstration of changes, we recorded a special video - all changes in the interfaces in it are not only shown, but also explained. Therefore, those readers who prefer to watch video tutorials rather than read articles can immediately go to watch the demonstration in Axure (to see all the details, it’s better to use full-screen mode):



For those who are more used to reading about the development of projects in text form, our story below.

Note: The new interface is currently in the testing phase and is not uploaded to the site, so for the time being it is impossible to “touch” it live.

What changed


As we wrote in the last post, the purpose of creating Aviagik is to give users more freedom in terms of choosing travel settings (“like pizza ingredients”).

Using the graphical interface, the key elements of which are the circle-ingredients, the traveler can specify various flight combinations - set the exact time of departure, airport of arrival, plan transfers in interesting cities, as well as see the change in ticket price on the fly and fix favorite options using a special icon the castle.

The first prototype of the service looked like this:



Many readers liked our idea of ​​a “circular” interface, however, we also voiced moments that we did not take into account in the first prototype.

Issue line


First of all, it turned out that the purpose of one or another interface element was not obvious to all users. Many simply did not understand that in Aviahik the formation of ticket parameters goes from left to right - first the departure city is selected, the date is adjusted, then the transfer cities are determined, and then information about the arrival time and destination is provided.

In order to highlight the data on the currently selected flight parameters, a “delivery line” was created - a backlight line in the middle of the screen that focuses the user's attention on those “ingredients” of the flight that he chose:



In addition, we did what was already suggested: we signed the dispensing columns themselves. Now at a glance at the screen it is clear where the information on the date of departure is located, where the cities of transfers are indicated, and where the data is on the date and place of arrival.

Calendar with tips


In the previous version of the interface it was not very convenient to compare the prices of tickets on specific days - and in fact often the traveler is not so important a day as the price of the trip. Therefore, we have added a special calendar to the top of the interface, which shows which day is cheaper to fly.

In the cell of a specific number, there is a background histogram showing the price level of tickets for that day:



By clicking on the icon of the calendar itself, a new window opens, through which you can see the difference in prices by numbers in more detail:



In the future, we plan to add a weather display function in the calendar so that travelers can choose the most profitable flights in clear weather.

Responsive interface elements


Now, important interface elements have become more responsive - by clicking on the column with transfers, arrival date or destination airport, additional menus are opened, which show information that does not fit in the original column:



The advantage of this solution was the possibility of placing full-fledged filters in these additional menus, which help flexibly adjust the flight without having to poke the mouse in the small circles of the main interface.

Route "thermometer"


In the comments to the first material, some users pointed out that they could not see the element that we call the “thermometer”, with information about the selected route.

Previously, it was rather pale and was located at the top of the screen. Now it is more noticeable and located at the bottom, because you need to access it less frequently than with the same calendar:



Future plans


Aviagik is still in the prototype stage, so we will still be happy to receive any feedback and comments regarding the interface solutions we have chosen. According to the results of the discussion of this material, the final changes will be made to the project, and it will be launched into “combat” operation.

That's all for today, thank you for your attention! Do not forget to subscribe to our blog .

Source: https://habr.com/ru/post/256919/


All Articles