Details
Congo is a closed file storage and synchronization service for desktop computers and mobile devices in the field.
Congo allows the user to save, open and manage documents, spreadsheets and Office files.
Due to the operational nature of the system, identifying details such as logo and name have been changed and classified texts have been censored.
Platform
Web version, tablet & mobile app
Duration
8 months
Role
UI/UX designer
Model
B2C
Purpose
All-In-One
The main purpose of Congo is to store and share important files among various elements in the army.
The system became operational in 2021.
A key advantage of the system is the ability to edit a document by several users at the same time.
Congo is linked to other services of Matzpen (including the operational chat system).
For example, you can publish and attach files from the drive directly to the chat.
Crafting The Personas
Who Are The Main Users?
A Little Extra
I received the system as a ready-made product.
Among the biggest challenges were re-characterizing existing screens and adding new screens without disrupting the daily operation of the system.
Each new feature was implemented gradually so as not to shock users.
User Requirements
The target audience of the system is military personnel.
Therefore, the system needs to be simple to operate but also sufficiently understandable with all the features built into it.
Unlike the operational chat, which is used every minute of the day comprehensively and immediately, Congo is not required for urgent operational use.
Here are some of the application requirements we received from users -
Synchronization between versions
Field users using the mobile version of the system demanded full synchronization between devices.
Creating a Dark Mode
Currently, users only have the option of a light mode. In light of the extensive work on the system, a demand arose to create a dark mode accordingly.
Export files to history
Due to multiple file uploads and their overwriting with new information, there was a demand to create a possibility of storing history files.
File management within the system
Users requested an option to create and edit files directly in the system.
My Process
Highlights and Takeaways
With the help of product managers and team leads, I was able to create, test, build, and characterize both the responsive web app and the native mobile app.
Weekly domain expert meetings -
We built strong trusting relationships with the development team, who helped us connect to external customers and internal field service engineers. We set up weekly calls where we learned more about the domain and functionality while also validating our designs as we went.
Focus on the top usability issues -
Since we had to be conservative with layout changes and we had to be mindful of the deadline, I decided to focus most of my “redesign energy” on the main usability problems of the most frequently used areas of the app.
User testing -
We had many rounds of user testing to validate those UI improvements.
Set up mid-sprint design reviews -
We also set up a mid-sprint design review. We did this because design feedback during sprint demos snowballed the JIRA tasks into the next sprint. Having a design review mid-sprint allows for a wider scope of revisions with at least 5 days to fix them, this helped us stay on track with design throughout the project.
Creative Thinking
Challenges Along The Way
Challenges that arose during work on the system -
Creating a single language
The system was built in a hasty manner and not closed by mandatory and permanent servants. Therefore, no single, consistent design language was defined, which resulted in different behaviors among identical components.
Accessibility and simplification
A significant portion of users are reserve personnel who do not work with the system on a daily basis. Therefore, it is necessary to think about how to make newly implemented features accessible to new and returning users.
Responsive design
The military operates several types of computer monitors of different sizes and resolutions.
Structure
Low-Fi Wireframes
Preview
Main Screens
Here are some of the intended screens for Congo.
Among them were also user requirements such as managing history files, making content accessible to new users, and more.
Responsive Design
Presented full responsively for web, tablet and mobile version.
Components
Connecting The Dots
Design System
A design system is a set of standards for managing design at scale. It reduces redundancy while creating a shared language and visual consistency across different pages and channels.
None of the unit's systems had a design system or any design sheets to follow.
as part of my job, I created a full custom design guide for each system.
Each new feature was implemented gradually so as not to shock users.
Dark Mode
Comfort Above All
Research shows that an app with a dark palette uses almost 90 percent less energy than a light palette. The dark mode also helps color stand out better without being too bright.
Dark mode reduces the screen's overall brightness, making it more comfortable, even with low ambient light.
We have received many inquiries from users who prefer to work with a system in dark colors for their personal comfort.
