What is wrong with the interfaces of air services # 2: How Aviageek has changed after a post on Habré

In the last topic, we talked about how our Aviagik project solves common interface problems of air services. The project is in the prototype stage, so feedback is valuable to us like nothing else. The audience of Habr did not let us down - the material received a great response and collected 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 we received, created a new version of the interface, and today we present to your attention the final prototype Aviagika before launching the service directly.

New interface

For the most visual demonstration of the changes, we recorded a special video - all changes to 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 see a demonstration in Axure (to see all the details, it is better to use full-screen mode):



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

Note: The new interface is currently in the testing phase and has not been uploaded to the site, so for now it’s not possible to “touch” it live.

What changed

As we wrote in a previous post, the goal of creating Aviagika 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 ingredient circles, the traveler can set various flight combinations - set the exact departure time, arrival airport, plan transfers in interesting cities, as well as see the ticket price change on the fly and fix the options you like using a special icon the castle.

The first prototype of the service was as follows:



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

Issuing string

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

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



In addition, we did what has been asking for a long time - we signed the extradition columns themselves. Now, at a glance at the screen, it is clear where the information is located on the departure date, where the cities of transfers are, 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 ticket prices on specific days - and often a traveler is not so much interested in the day as the price of the trip. Therefore, we added a special calendar to the top of the interface, showing which day it is cheaper to fly.

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



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



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

Responsive UI Elements

Now the important elements of the interface have become more responsive - by clicking on the transfer column, arrival date or destination airport, additional menus open that display information that did not fit in the original column: The



advantage of this solution was the possibility of placing full filters in these additional menus that help flexibly set up a flight without having to poke the mouse into small circles of the main interface.

Route "thermometer"

In the comments on the first article, some users indicated 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 visible and is located below, since you need to access it not as often as the same calendar:

Future plans

Aviagik is still in the prototype stage, so we will continue to welcome any feedback and comments regarding our chosen interface solutions. Based on the discussion of this material, final changes will be made to the project, and it will be put into “combat” operation.

That's all for today, thanks for watching! Do not forget to subscribe to our blog .