Animality
Documentation and designs for the video streaming platform and mobile application
About the Project Animality
Animality is one of the projects of the Centaurus Foundation, which we implemented from the idea to the finished, digital product. The aim of the project was to create an international video platform that educates and engages, presenting activities for animals carried out in different corners of the world. It is a virtual space that connects organizations, volunteers and people who care about the fate of animals.
Scope of work on documentation
Our task was to comprehensively develop implementation documentation and graphic designs for the Animality video streaming platform in JAVA technology and a mobile application (IOS and Android). Its task was to transfer the Animality experience to mobile devices, so as to facilitate viewing videos on mobile devices (as in the Netflix application, for example). Considering the global scope of the project, in pre-implementation work we had to solve the issue of language versions of views for the Subscriber Donor, as well as panels for managing content and the platform in a distributed model for Creators from around the world.
User role analysis and system architecture
Together with the eFresh development team, we analyzed user roles, developed functional assumptions, and then translated them into descriptions of key views, user paths, and interface structure. The resulting documentation became the basis for preparing low-fidelity mockups that organized the entire system and allowed for a smooth transition to designing target layouts.
Key roles defined on the platform:
Group A Donors_Subscribers (Viewers) – people supporting the project, including both Adults and children (content recipients)
Group B Centers_Content creators – animal caretakers showing their daily work and sharing their experience in caring for animals from all over the world.
Group C Animality Team – scriptwriters, video editors, center caretakers – all people who process content and operate the platform
Group D Animality Managers – the team managing processes on the platform and making key decisions
At the analysis stage, we paid great attention to developing the system architecture and the principles of communication between its individual modules, taking into account the needs of individual user groups.
List of views and functionalities
The result of the analyses and conceptual work was a document called userflow, in which we described the processes taking place on the platform, user registration and login algorithms, and the assumptions of the operation of individual views. For the needs of the video streaming platform, a document of over 600 pages was created, which was the basis for the design stage and creation of clickable mockups.
To organize the subsequent work, we have developed a list of views (unique and complementary) in the monday software, along with guidelines for designers. With a large number of views, it is necessary to plan the work carefully to avoid gaps and contradictions.
This step created the skeleton of the entire platform: from registration and login screens, through onboarding and start views, to returning user scenarios and detailed views of video materials and account settings. Each screen had its role and place in the application architecture – nothing was left to chance.
Conceptual Design Key Views
After completing the UX work, our team of designers took over the implementation of the tasks and prepared the first, conceptual designs of the most important views, from the point of view of the Project Owner. At this stage, we showed sample home views (illustrating, among others, the rules of video filtration and tagging), center views (operating on the principle of YT channels), views of displaying selected videos and examples of simple additional views such as special messages.
Development of a design system for the platform
An important element of our work, especially in complex projects, is the development of a coherent Design System, i.e. the rules for creating a grid (the layout of individual views), designing and using buttons, building sections or creating illustrations. A well-designed Design System significantly facilitates the work of the development team and allows avoiding many errors in the implementation phase.
Donator_Abonent Mock-up prototypes of the web desktop version
In this phase of work, we transformed previously defined functionalities and views into specific, interactive mockups for the desktop version of the platform from the perspective of the Donator_Abonent (otherwise known as the Viewer). We focused on ergonomics, intuitive navigation and readability of the layout to provide users with the best possible experience while using the platform. When designing, we based it on the best experiences of platforms such as Netflix, HBO Max and ShowTime.
Donator_Abonent dark version desktop
In addition to standard work, desktop views have been optimized for user needs and modern trends, hence the dark version of the interface. It provides comfort of use in low light conditions and emphasizes the modern nature of the platform. In addition, we have designed a system on the platform that allows for the adjustment of font sizes for the visually impaired.
Donator_Abonent Mobile version – responsive platform design
When designing the mobile version of the platform, we took care of an intuitive and clear layout that provides comfortable use on various screen sizes. We focused on smooth access to the most important functions and convenient navigation, so that the user experience is consistent with the desktop version.
Donator_Abonent
dark version - mobile version of the platform
We have adapted the dark theme to the specifics of mobile devices, ensuring optimal contrast and comfort of use on the move. This makes using the platform on smartphones and tablets pleasant regardless of lighting conditions.
Donator_Subscriber mobile application
Although the Animality mobile app is very similar in functionality to the mobile web version, its mockups required a separate approach. This allowed us to better utilize the native app’s capabilities, such as push notifications, quick access from the home screen, and offline work. Our mockups focused on user experience and intuitive navigation, adapting the layout and interface elements to the specifics of mobile devices with Android and iOS systems.
We designed the mobile app views in light and dark mode, for user convenience. The graphic work on the mobile app layouts included creating all the necessary views: those that are important for the proper functioning and use of the mobile app, but also auxiliary and additional views.
Extended management panel for Animality Team processes
An important element of the platform was the extensive ERP system developed and designed by us, supporting processes on the platform divided into individual departments: Marketing (promotional activities, mailings, traffic control, contact with Celebrities), BOK (Customer Service Office-Subscriber), Content (creating and publishing videos), Fundraising or IT and accounting.
The developed system enabled intuitive and easy work planning, task control, exchange of information between departments and control, e.g. how to solve problems reported by Subscribers.
Centers and Creators or Content Management
From the point of view of supplying the platform with content, we developed an entire system available after logging in, allowing control over the progress of work on a given video episode. Due to the very plans, which assumed cooperation with 200 centers and the creation of over 800 episodes a week, managing this process was crucial for the proper functioning of Animality. We divided the process into: preparatory tasks (the so-called task plan), i.e. work on the script and concept, work on episodes in preparation (the so-called publication plan) and the database of published episodes. We adapted the management of tasks and files in the designed system to this process accordingly.
Functionalities for the Animality Center and Team
The designed system allowed easy control not only of the episode creation process (from the script and inspiration prepared by Animality scriptwriters, through control of raw materials recorded by Creators in the Centers to supervision of the editing phases) but also of practically all organizational processes. Our assumption was to create a work environment and to make the work of the entire team as easy as possible (hence, among others, alert systems for tasks or the possibility of commenting on each episode)
Platform Results Reporting Module
An important module developed by us for Animality is an advanced reporting system divided into several views: General Report (key platform results, available to the Animality team), Center Report (selected platform results in terms of settlements and donations to the Center creating content for the platform, information on the status of settlements), Management Report (focused on the financial results of the platform) and Report for Celebrity (simplified, allowing for easy verification of settlements with Celebrity, which is the brandface of the project). Obtaining reliable results in these reports required designing detailed algorithms enabling data download from the platform in live mode.
Developmental functions
In the process of creating documentation, there are always a lot of ideas and improvements at different stages of work. From experience, we know that in order for the project to be implemented at a reasonable cost and time, some of them must be postponed as development functions. In the Animality project, we postponed to this stage, among others, the extremely promising e-learning module or live animality care.
DO YOU HAVE A VISION YOU WANT TO FULFILL?
Contact us and we will help you build a brand that will conquer the market.