Barrier-free

Here you can learn how to take part in building a barrier-free Ukraine

#GovTech echoes
GovTech
website development
branding&UX/UI design

The NGO “Barrier-free” is the implementing partner of First Lady Olena Zelenska’s initiatives — the National Mental Health Program and “Without Barriers”, both aimed at ensuring equal access and inclusion for all Ukrainians.

Project goal:

To make barrier-free accessibility a new social norm where every person, regardless of age, background, or health condition, can exercise their rights, learn, work, move freely, and participate in community life.

After Russia’s full-scale invasion, another focus of the NGO “Barrier-Free” became advocating for change in the field of mental health, both at the state level and within public awareness.

This website is part of that work. It brings together knowledge, examples, solutions, and tools that can help make life barrier-free: in communities, in organizations, in urban environments, and online.

More about the Barrier-free website

The website will include written and printable materials in various formats (articles, news, guides, case studies, handbooks, and more). Based on this content, it will serve as a platform both for finding information on specific topics and for building broader awareness of barrier-free accessibility in Ukraine.

Creating an information website

There was a large amount of informational content that needed to be structured and published on the website.

Helpful materials

A user-friendly catalog of all barrier-free resources — organized by topics and presented as instructions, tips, checklists, and guides.

Illustrations

Visual materials that explain barrier-free accessibility and support the creation of inclusive environments.

Stories

Stories of people who overcome barriers and inspire others through their experiences.

Include links to other web resources within the site

Incorporating all existing projects and resources as separate pages on the website would have been too complex (and in some cases nearly impossible). Therefore, we agreed to include links to other web resources within the site.

How people will find answers to their questions?

Знайти ці відповіді можна буде таким чином: 

  1. За пошуком на першій сторінці сайту за ключовим словом або фразою.

  2. У відповідній частині сайту. Наприклад, у блозі, статях тощо.

  3. Якщо користувач вже читає одну статтю, то за пролінкованим словом буде можливість перейти на іншу. Також, буде можливість під статтею або будь-яким іншим матеріалом перейти на статтю на схожу тематику.

Project design

For the visual style, we used the existing Barrier-Free Brandbook, integrating a custom Barrier Free font and other brand elements into the website design. This includes the main Barrier-Free logo, logos for each type of Barrier-Free initiative (the “Flower”), and their individual color palettes.

Key development requirements:
1
Mobile-first development principle.
2
High site loading speed.
3
Minimalist design, simple to understand even for inexperienced users, without overwhelming elements, fully aligned with the Barrier-Free brandbook (fonts, logos, color schemes, etc.)
4
Ability to embed video and photo materials on pages.
5
Compliance with Web Content Accessibility Guidelines (WCAG 2.2).
6
Dropdown menus for certain sections, especially main ones.

Web accessibility (WCAG)

The site was developed in accordance with Web Content Accessibility Guidelines (WCAG 2.2).

What about the tech stack?

The website is built on WordPress, configured for easy and fast content management: adding, deleting, and updating site content, menu items, and internal pages through the admin panel. Users can also sort materials by publication date, share content on social media, save, and print it.

What does this mean for people?

The site has become the main national online platform containing all essential information about Barrier-Free accessibility for the state, businesses, and communities. Now anyone can contribute to building a barrier-free Ukraine.

You might like these cases

bird
L
e
t
'
s
t
a
l
k
a
b
o
u
t
y
o
u
r
p
r
o
j
e
c
t
?