The making of the Stoloto mobile website templates

Overview• Process

Working on structure. Writing a list of elements and functions implemented in current versions of the main website, mobile application and mobile website. Understanding which of them are shared across all platforms and which are unique. Creating a new inheritance diagram.

Existing function inheritance
Required function inheritance

Elaborating the structure. Keeping in mind the existing mobile application to minimize the difference in logic and navigation.

Making the first approach to page design. Adapting the style of website concepts to the existing application.

The new website should be lighter than the application and load quickly regardless of the quality of internet connection.

Getting the client’s request to make game banners more informative. Changing the structure of the main screen. Choosing a more minimalist direction for the style. Using single colors instead of gradients, removing excessive images and animation.

Assembling a prototype and testing.

We are satisfied with the chosen direction. Since the client is rushing to release the website, dividing the project into two concurrent branches: version 1.5 for the upcoming release and version 2.0 for the final release. Focusing on 1.5 for the time being.

At this point unexpected happens: the client approves a new visual style where blue and white colors are abandoned in favor of black and yellow. Urgently making changes to the mock-ups.

Sending the mock-ups for development, drawing final icons and creating a web typeface.

The client asks to add an archive of previous draw results to version 1.5.

Tracing the evolution of the main screen.


Meanwhile, Legislative Assembly of Saint Petersburg passes bylaw 361 which forbids distribution of instant lotteries that make use of mechanical, electrical, electronic or other technical devices. Removing all instant games from the release replacing them with draw games.