People often ask us what they can do with OutSystems. We always reply: whatever they want! Today, we share a story that happened recently at OutSystems Build for the Future Hackathon, in which everis, an NTT DATA Company designed and developed an outstanding app that led them to winning first place and the Best User Experience Award.

The Story

Ideas to help save the world: everybody has them, right? But, building something and getting it to work is another story.

Everything started with an idea called Build for the Future Hackathon that lasted 5 weeks, took a lot of effort, and resulted in great solutions to solve real-world problems to help non-profit organizations.

Fifteen teams participated and everis was one of them with the motto “Turn our energy into a good deed”.

The Hackathon’s jury had nonprofit organizations’ members, OutSystems Experts, and people from Intellyx and Amazon AWS.

everis’ app won 3 of the most important prizes:

• Winner of the Challenge (CCT)
• Best User Experience
• Best Technical Solution

The Challenge

everis worked with the Nelson Mandela University Center for Community Technologies (CTT), an organization focused on empowering and developing people and their wellbeing, particularly in disadvantaged, vulnerable, and deep rural communities of South Africa. Partnering with CANSA (Cancer Association of South Africa), the goal was to tackle the stigma around cancer and cancer patients, which can lead to them not getting the information, diagnosis, and treatment they need.

OutSystems hackathon was a great opportunity to design and develop a solution that could help address this problem. Given the country’s geographical distribution and the overall technological adoption, it was clear to the team that the app should be a mobile application that users could resort to whenever necessary. Working offline was also important, to avoid data usage.

What to Consider: Key Design Decisions

So, what should the app support? What did its users need? Were there any specific requirements to watch out for? The whole experience and interface had to meet expectations and requirements and the way everis’ team did it really made the difference. Next, we highlight key design decisions that contributed to this app’s success.

1. Cultural Inclusiveness

The most important focus for the everis team was the user experience of the app. Intuitive navigation and easy understanding of its contents were a priority, given the diversity of users the app was expected to have.

There was also a special requirement: it needed to be a culturally respectful app, so it was well-received by people from very different backgrounds. This was addressed through carefully crafted illustrations, using neutral colors, to ensure all users easily identified with the app.

2. Gamification

To increase user adoption and engagement, and to show progress in the contents users have mastered, everis developed an interesting gamification feature. As the user’s knowledge evolves, their flower grows and blooms, rewarding the user’s content exploration.

3. Accessibility

Accessibility concerns are important in all apps - and this was no exception. Text-background contrast to increase readability and text to speech, to help users understand the content when they’re not able to read, were taken into account in the app’s design. All screens were designed carefully, so that the app was always attractive and engaging and no text-heavy screens existed, to drive users away from the app. The high number of colorblind men in the communities was also taken into account, so colors were chosen to support colorblindness.

4. Animations to Guide Users in Key Areas

Self-examination steps were explained using lottie animations that could be fully visible offline without the need for user interaction. These animations show how the user can perform a self-exam in a visual way, reducing the need to read a lengthy explanation.

5. Multi-Language

Language should not be a barrier, but something that unifies us - and this is why the app had to support multiple languages: Xhosa, Zulu, Afrikaans, and English were included from the start to increase acceptance and inclusiveness of the different communities. This also helped address the problem of very little information about cancer being available in most of these languages.

6. Fully Offline Content

To make sure the app could also reach rural communities that don’t have the same access to the Internet as the urban areas, the mobile application was developed so users can access all contents offline.

Key Takeaways

What helped everis design a delightful app was the attention the team gave to the context of the app (geographical distribution, mobile usage), its users (different backgrounds, ages, literacy levels and accessibility requirements) and how they made sure their app addressed these specific needs.

Technology was there to help and support these needs. So, what can you do with OutSystems? Anything you want to delight your app’s users!

Congratulations to the team for their work creating a wonderful experience with OutSystems!

Everis’ Team Members

• João Alves, Project Manager
• Nadine Gandaio, Lead Solution Architect
• Nivaldo Pereira, Solutions Analyst
• Helena Lameiro, Solutions Analyst
• Daniela Santos, Front-End- Developer
• Francisco Cunha, UX/UI Expert
• Nuno Gomes, Manager

This article was co-written by Filipa Jervis, Head of UX at OutSystems.