The making of the Stoloto mobile website templates
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.
![stoloto mobile process 02](stoloto-mobile-process-02.jpg)
Making the first approach to page design. Adapting the style of website concepts to the existing application.
![stoloto mobile process 03](stoloto-mobile-process-03.jpg)
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.
![stoloto mobile process 04](stoloto-mobile-process-04.jpg)
Assembling a prototype and testing.
![stoloto mobile process 05](stoloto-mobile-process-05.jpg)
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.
![stoloto mobile process 06](stoloto-mobile-process-06.jpg)
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.
![stoloto mobile process 07](stoloto-mobile-process-07.jpg)
Sending the mock-ups for development, drawing final icons and creating a web typeface.
![stoloto mobile process 08](stoloto-mobile-process-08.jpg)
The client asks to add an archive of previous draw results to version 1.5.
![stoloto mobile process 09](stoloto-mobile-process-09.jpg)
Tracing the evolution of the main screen.
![stoloto mobile process 10](stoloto-mobile-process-10.jpg)
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.