A 100% Nocode website to help young people in distress
As the new Alegria.academy class has started the new school year, it is time for the first trainees to join their work-study companies for the next nine months.
To bring the first three months of training to a close, we had to make sure they were ready to jump into the deep end (no, it's not a second pool!). And for that, nothing like a hackathon.
What is a hackathon?
The principle? The different teams design and create a digital solution from scratch to meet a previously established need and specifications. Then comes the presentation pitch in front of the educational team, which decides between them.
The technical stack? For this hackathon, students must use the Nocode Webflow, Airtable and Make tools.
At the end of two days of development in project mode, the winner was announced. It is the project Side by Side, led by the group of Léna, Magali and Hélène!
These three students, with very different backgrounds, have succeeded in creating a real synergy by combining their different strengths in Nocode in order to propose the SidebySide website.
This online platform, which helps young people aged 14 to 25 in difficulty, allows them to be redirected to dedicated organisations (associations, homes, health professionals, etc.), particularly in the event of an emergency.
The idea for the project came from Léna, a young woman of 22 who has been exposed to these situations of distress and wanted to use the Nocode for this cause. Hélène and Magali immediately joined the project.
An all-female trio with varied backgrounds
Passionate about computers and Japanese culture, Léna started coding her first websites at the age of 12, in a self-taught way. Then she studied design in art school. The periods of confinement disrupted this training. She then discovered Nocode and decided to learn its tools.
Hélène is a space designer (or interior architect) and an expert in professional real estate. Attracted by the digital world, Nocode is for her a gateway to the creation of digital tools. Eventually, she would like to make it a full-fledged activity that she would like to cross with her original activity of design consulting.
Magali is currently undergoing a professional reconversion. After 10 years as a Pôle Emploi counsellor but also as an IT recruiter, she decided to acquire these skills herself and become a Nocode Maker.
What solutions are there to help young people in distress?
A pathway focused on accessibility
1. Think 'mobile first' - Webflow
One thing is certain for the three students: accessibility is the #1 success criterion.
This starting point makes them opt for a site rather than a mobile app that would require installation, possibly a WiFi connection, etc.
Their priority is to quickly create a platform to help young people in difficulty. Webflow is the ideal tool to develop a website without coding.
The site must load quickly and be responsive, even 'mobile first'. They therefore use Webflow to build their project.
Contact is the motivation for visiting this page. Thus, the emergency numbers to contact must be particularly visible and actionable. *
2. UX/UI: Putting ourselves in the shoes of young people in difficulty for an intuitive journey - Figma
After writing the user stories, the three students admit that Side by Side should cover an ambitious spectrum of cases: from emergency to long-term help.
The entrance doors must also be quickly identifiable: users must spontaneously recognise their situation and be guided through.
On the basis of their user stories, Magali, Hélène and Léna made the first mock-ups of their page and of the site path on the Nocode Figma design tool:
The Side by Side homepage is a two-way street: either you are looking for help or you want to give it.
The students Hélène, Magali and Léna planned a course adapted to real-life use cases to provide adequate answers.
Clicking on the search for help offers 3 scenarios that cover all possible situations:
- Have an URGENTneed for help
- Seek more or less sustainable support
- Find the right type of professional or association for a specific situation
Behind the scenes: creating realistic scenarios
Before launching into a model, Hélène, Magali and Léna lay out the different cases in a flowchart on figma which allows them to detail the different contact procedures and the stages of each process.
1. Searching for help: gathering information to respond - Tally x Airtable
To help young people in difficulty, the challenge is twofold: on the one hand, it is necessary to collect a minimum amount of data to provide an appropriate response and, on the other, to limit the number of steps to be taken so as not to discourage the search for help.
The solution chosen by Hélène, Magali and Léna is the automated sending of a Tally form which feeds a database hosted on Airtable.
From a user point of view, clicking on the help request directly opens a form to be completed by the person in distress.
2. Provide a reassuring and instantaneous presence through well-configured automations - Airtable x Make x Gmail
Thanks to a scenario configured on the Make (ex-Integromat) process automation tool, the young person receives an immediate response confirming that his or her request for help has been dealt with.
The Side by Side team is informed by email and receives a notification according to the responses selected by the young person and the degree of urgency identified.
And that's where it gets tricky! Hélène, Magali and Léna had to connect Webflow (the site builder in which they created their page), Tally (the form tool), Airtable (the database that collects the data from the form) and Gmail to send messages to the young person and the Side by Side team.
It is a well thought out process by the three students and cleverly configured in Make :
The elegance of their solution lies in the identification of the degree of urgency and need for help, which allows for a personalised follow-up.
Indeed, the teams will be notified more or less quickly depending on the degree of urgency. To do this, they used a "multiselect" option of the types of help sought and Make iterator to process the selected answers.
3. Immediate responses for emergencies - Automatic bot x Airtable / Make x Gmail
Some situations do not allow waiting for a form to be filled in.
Hélène, Magali and Léna have therefore adapted their contact scenario to the case of extreme urgency by replacing the form with a streamlined instant chat with the Landbot tool.
The whole process is again set to Make to connect the steps:
- The data exchanged on the automatic chat feeds the Airtable
- Teams are immediately notified of the emergency
- The call for help is handled by the teams as soon as the message is received
4. Transmit practical information 100% automatically - Tally x Airtable/Make x GMail
Thanks to the database built on Airtable and fed by volunteers who register directly on the platform, Side by Side has a well-categorised network of carers.
When a young person requests information on carers adapted to his/her situation via a form, his/her request is automatically analysed on Make and he/she receives an instant response by email with a list of carers according to 2 categories (professionals or associations) and which correspond to his/her geographical area.
A very complete solution, 100% Nocode, but hampered by the administrative reality
The winners of the first Alegria.academy hackathon created a beautiful, stable and fluid solution in just 3 days (and part-time at that!) that meets a real humanitarian need.
They made the most of each Nocode tool by customising the scenarios thanks to automations on Make, using different tools to feed an Airtable database (form or chatbot) and had a very "user-centric" approach by starting from use cases thanks to user stories and the realisation of models on Figma.
The little extra that gives their site extra credibility and adds a degree of professionalism is the use of CMS webflow to integrate "rich content", i.e. documentation and resources on the theme of their action.
Indeed, they even thought of integrating verbatims from young people and readings on topical issues. Well done!
Unfortunately, it is not clear that Side by Side will be able to provide the level of support for young people in difficulty that the three young women are aiming for.
Indeed, they quickly came up against constraints in obtaining authorizations. In particular, the processing of medical data, especially for minors, is problematic. Their mission must remain 100% voluntary and they hope to give it a chance on a local scale to start with.
.webp)
.svg)
