L’Arche en France

L’Arche en France

Deliverables

Strategy · UX/UI designs · High fidelity prototype · Design System

Diseño UX/UI para Fundacion L'Arche - David Ramirez - Ramiz

a national community serving those in need.

Diseño UX/UI para Fundacion L'Arche - David Ramirez - Ramiz

a national community serving those in need.

Diseño UX/UI para Fundacion L'Arche - David Ramirez - Ramiz

a national community serving those in need.

Client

L’Arche

Rol

Product Design Lead · UX/UI Design

Deliverables

UX research, Strategy, Product design, Branding

Field

Third sector

Year

2024

Introducción

L’Arche es una organización que trabaja en favor de las personas con discapacidad mental en todo el territorio Francés. Gracias a su alcance, han decidido reforzar sus programas de voluntariado y donaciones fortaleciendo su experiencia digital.

L’Arche es una organización que trabaja en favor de las personas con discapacidad mental en todo el territorio Francés. Gracias a su alcance, han decidido reforzar sus programas de voluntariado y donaciones fortaleciendo su experiencia digital.

L’Arche es una organización que trabaja en favor de las personas con discapacidad mental en todo el territorio Francés. Gracias a su alcance, han decidido reforzar sus programas de voluntariado y donaciones fortaleciendo su experiencia digital.

A new identity

A new identity

Since the Living LAB concept is not widely understood, we decided to create a brand that would lead to thinking about playful digital spaces, where the sum of information creates new things, and voilà! the Bit-A-Bit brand was born. The logo mixes pixel-style graphics with an adapted typography, and includes a person-like icon. We designed the brand to be easy to understand, showing how digital tools can be good for us.

In this project, I served as the Product Design Lead within The Imageniers' design team.

Our vision

Our vision

Minimize the digital divide to maximize the involvement of the educational community.

Minimize the digital divide to maximize the involvement of the educational community.

Problem

Problem

Las personas interesadas en ser parte del proyecto de L’Arche no saben cómo; la confusión causada por grandes volúmenes de información inconexa y la oferta poco clara influían negativamente en la toma de decisiones.

Las personas interesadas en ser parte del proyecto de L’Arche no saben cómo; la confusión causada por grandes volúmenes de información inconexa y la oferta poco clara influían negativamente en la toma de decisiones.

Las personas interesadas en ser parte del proyecto de L’Arche no saben cómo; la confusión causada por grandes volúmenes de información inconexa y la oferta poco clara influían negativamente en la toma de decisiones.

Phase 1

Diagnosis

Local educational authorities and some stakeholders participated.

Phase 1

Diagnosis

Local educational authorities and some stakeholders participated.

Phase 2

Experimentation and prototyping

Addressed to the educational community: Students, parents, and teachers.

Phase 2

Experimentation and prototyping

Addressed to the educational community: Students, parents, and teachers.

Phase 3

Presentation of results

Detailed report of activities + Landing page with the Decalogue of best practices

Phase 3

Presentation of results

Detailed report of activities + Landing page with the Decalogue of best practices

Learnings

Learnings

1.

Making the living lab a brand will allow audiences to identify with it, empathize with its language, and feel interested in the ecosystem that defines it.

2.

Workshop results serve as inspiration for enhancing visual content and design tools. Therefore, the design should remain flexible, evolving based on gathered experiences.

Learnings

1.

Making the living lab a brand will allow audiences to identify with it, empathize with its language, and feel interested in the ecosystem that defines it.

2.

Workshop results serve as inspiration for enhancing visual content and design tools. Therefore, the design should remain flexible, evolving based on gathered experiences.

Pow! We have an idea

Pow! We have an idea

Pow! We have an idea

Inspired by L'Arche's spirit of coexistence and the diversity of the new visual identity, we created a people-centric website. We designed interactive spaces where photography, copy, and testimonials weave compelling narratives. This approach amplifies the voices of beneficiaries and showcases the positive impact of those contributing to the project.

Discover how to join the cause

Discover how to join the cause

After revamping the website structure and conducting user tests, we recognized the need for a navigation menu that clearly distinguishes the various ways to participate in the project. We created dedicated sections for engagement, donations, and a guide. To reinforce this, we placed "Call-cards" throughout the pages—messages that encourage users to explore information more deeply or reach out to the team.

Visit the website for details

Visit the website
to see the details:

The Guide is a questionnaire that helps people discover ways to get involved based on a set of parameters. This tool simplifies the search process and shortens the decision-making journey.

Visit the website for details

The Guide is a questionnaire that helps people discover ways to get involved based on a set of parameters. This tool simplifies the search process and shortens the decision-making journey.

Amplifying the Voices of Beneficiaries

Amplifying the Voices of Beneficiaries

Honesty and transparency are core values for potential participants, which is why testimonials feature prominently throughout the website. By showcasing experiences from workers, volunteers, entrepreneurs, and people with disabilities, we highlight the foundation's human-centric approach. These personal stories effectively convey the benefits of joining the project, reinforcing L'Arche's authentic character.

Color-coding to guide users

Color-coding to guide users

Leveraging L'Arche's extensive color palette, we chromatically reinforced the participation options: donations are associated with *salmon orange*, while engagements are linked to *steel blue*. This color-coding guides users through the Gestalt principle of similarity, enhancing intuitive navigation.

Dynamic information blocks

Dynamic information blocks

A project of this scale has numerous stories to tell and data to showcase. We created a diverse system of dynamic blocks to help the client present information in various ways. This system optimizes the website's reading flow, standardizes the type of information to be uploaded, and sparks the client's creativity.

A Tailored Design System for Communities

A Tailored Design System for Communities

To ensure the 39 communities' digital teams could effectively adopt the new web ecosystem, we created a design system in Notion. This system focuses on teaching WordPress content management in a didactic and illustrated manner. While the teams had prior experience with WordPress, they needed guidance on the new website's specific logic and structure.

Anticipating the website's growth, we developed a block library. This resource provides detailed explanations on how to leverage the designed elements, guides users through the creation and editing processes, and connects various components of the system.

What did I learn?

What did I learn?

What did I learn?

Apply Scrum Methodology

Apply Scrum Methodology

Leading a project of this magnitude—with multiple teams and tight deadlines—was a first for me. I decided to implement the Scrum methodology, taking on the role of Scrum Master. This decision led to more coherent project management. I learned the importance of motivating people, trusting them, and adopting a pragmatic approach in high-effort projects. The experience deepened my understanding of effective leadership in complex, time-sensitive environments.

Don't fight against time

Don't fight against time

As a product design lead, it's crucial to address challenges arising from tight deadlines and project uncertainties. Investing time in workflow planning and carefully selecting appropriate tools and resources is key to agile effort management. This proactive approach ultimately saves considerable time throughout the project lifecycle.

Design tools

Hey! You made it this far.

Can I assume then that you liked what you saw and are considering contacting me 😃? Leave me a message so we can start co-creating.

Hey! You made it this far.

Can I assume then that you liked what you saw and are considering contacting me 😃? Leave me a message so we can start co-creating.

Hey! You made it this far.

Can I assume then that you liked what you saw and are considering contacting me 😃? Leave me a message so we can start co-creating.

Creactivism for a better society.

Ramiz© 2025

Barcelona

Creactivism for a better society.

Ramiz© 2025

Barcelona

Creactivism for a better society.

Ramiz© 2025

Barcelona