PROJECT
New responsive web site
for a CityHall
The old website of the community of Saint-Ouen-Marchefroy was dated from the late 90s. It was in dire need of renewal, appearance improvement, lacked clear structure and smooth navigation, and needed a bit of interactivity.
The website of Saint-Ouen-Marchefroy has been revamped and is now more engaging and user-friendly. It provides a platform for the town to showcase its rich heritage and modernity, and it’s great to see that it’s appealing to all ages. It’s a great way to discover and engage with Saint-Ouen-Marchefroy.
CLIENT
City Hall
GOAL
Provide a functional, clearely structured,
user-friendly, easy managable
and responsive website
Tools
CMS, Illustrator, Photoshop
YEAR
2023
Custom 404 Error Page
This page turns a potential moment of frustration into a light-hearted experience, gently guiding users back to familiar ground with a charming illustration and clear navigation options.
1
Project Assessment
Evaluation of needs, budget, and the client's objectives
1
1
User Analysis
Analysis of users, their needs and expectations for the new website
2
1
Platform Research
Research, analysis, and choice of CMS and hosting
3
1
Domain Setup
Choice, management of purchase, and configuration of the domain name
4
1
Mapping
Creation of a site map
5
1
Content
Content gathering, text and images, documentation, etc
6
1
Structure design
Definition of the layout, organizing content in a logical structure, hierarchy
7
1
Mockups
Mockups creation
8
1
Text Refinement
Adaptation and creation
of texts, legal informations included
9
1
Implementation
Creation of a responsive website for desktop/mobile
10
1
SEO
Search Engine Optimization and indexing
11
1
User and technical
support
Training of municipal employees on website management and updating
12
Alternative menu option
Before
After
Streamlined Interface
A clear design with a structured layout and optimal white space. Icons and colors highlight key sections, enhancing the visual hierarchy and user engagement. Functional design and intuitive cues.
Typography
The combination of Raleway's elegant lines with Avenir Light's geometric clarity creates a user-centric interface, blending contemporary style with accessible functionality.
Raleway is a sleek, sans-serif
typeface with a clean and elegant design.
Title : Raleway
Raleway Semi-Bold
ABCDEFGHIJKLMNO
PQRSTUVWXYZ
abcdefghijklmnopq
rstuvwxyz
0123456789
!#$%^&*()
Raleway Regular
ABCDEFGHIJKLMNO
PQRSTUVWXYZ
abcdefghijklmnopq
rstuvwxyz
0123456789
!#$%^&*()
TITLE 1 : 54 px
Title 2 : 40 px
Title 3 : 36 px
Title 4 : 30 px
Title 5 : 26 px
Paragraph : Avenir Light
Avenir Light is a sans-serif font with a harmonious and clean design, prized for its contemporary and highly legible appearance.
Avenir Light Bold
ABCDEFGHIJKLMNO
PQRSTUVWXYZ
abcdefghijklmnopq
rstuvwxyz
0123456789
!@#$%^&*()
Avenir Light Regular
ABCDEFGHIJKLMNO
PQRSTUVWXYZ
abcdefghijklmnopq
rstuvwxyz
0123456789
!@#$%^&*()
Paragraph 1 : 18 px
Que ce soit pour des travaux réalisés à l’intérieur de votre habitation, les horaires autorisés pour l’utilisation d’engins bruyants de jardinage et de bricolage ...
Paragraph 2 : 16 px
Que ce soit pour des travaux réalisés à l’intérieur de votre habitation, les horaires autorisés pour l’utilisation d’engins bruyants de jardinage et de bricolage ...
Button : 16 px
#993399
Purple
The color representing Saint-Ouen and commemorating Saint Ouen's role as a bishop.
#0066ff
Blue (Azur)
The shield's blue, a traditional French color, echoes the "Cinq Croix de France" monument's name from the time when Normandy neared English rule.
#33cc66
Green (Sinople)
Symbolizing Marchefroy, chosen for its greenery and natural landmarks such as, Les Fougères, Les Houx, and Les Châtaigniers.
#F7B812
Gold
At the heart, the five golden crosses stand as the most significant element, marking the heritage of the commune and the monument between Saint-Ouen and Marchefroy.
#993399
Purple
The color representing Saint-Ouen and commemorating Saint Ouen's role as a bishop.
#0066ff
Blue Azur
The shield's blue, a traditional French color, echoes the "Cinq Croix de France" monument's name from the time when Normandy neared English rule.
#33cc66
Green / Sinople
Symbolizing Marchefroy, chosen for its greenery and natural landmarks such as, Les Fougères, Les Houx, and Les Châtaigniers.
#f7b812
Gold
At the heart, the five golden crosses stand as the most significant element, marking the heritage of the commune and the monument between Saint-Ouen and Marchefroy.
The Coat of Arms
of SOM
The updated coat of arms features enhanced contrast, bolder colors, and sharper details, offering a modernized and more visually impactful representation of Saint-Ouen-Marchefroy's heritage.
Web Interactivity
To enhance communication and engagement, interactive features such as contact forms, search functionalities, event registration capabilities, feedback sections, and more were proposed to the city hall team .
Contact Form
Allows users to easily reach out to the city hall with inquiries or concerns.
Site Search Form
Enables users to quickly find the information they need on the website.
Social Media
Sharing
Facilitates the dissemination of information through popular social networks, expanding the reach of city hall's communications.
Accessibility
Ensures the website is navigable and usable by people with disabilities, promoting inclusivity.
FAQ Section
Answers common questions, offering instant support and information to website visitors.
Polls and
Surveys Form
Engages the community in decision-making processes by collecting their views and preferences.
Newsletter
Subscription
Keeps the community updated with the latest news and announcements via email.
Feedback and
Comments Form
Provides a platform for sharing opinions or leaving comments on events or news, encouraging public participation.
Event Calendar
Offers the ability to sign up for events or confirm attendance, keeping the community involved in local happenings.
Interactive Features
Among a range of actual features was proposed to the team, contact and search forms were retained.
FAQ Section
Answers common questions, offering instant support and information to website visitors.
Newsletter
Subscription
Keeps the community updated with the latest news and announcements via email.
Polls and
Surveys Form
Engages the community in decision-making processes by collecting their views and preferences.
Event Calendar
Offers the ability to sign up for events or confirm attendance, keeping the community involved in local happenings.
Contact Form
Allows users to easily reach out to the town hall with inquiries or concerns.
Feedback
and Comments Form
Provides a platform for sharing opinions or leaving comments on events or news, encouraging public participation.
Site Search Form
Enables users to quickly find the information they need on the website.
Accessibility
Ensures the website is navigable and usable by people with disabilities, promoting inclusivity.
Feedback
and Comments Form
Provides a platform for sharing opinions or leaving comments on events or news, encouraging public participation.
Social Media Sharing
Facilitates the dissemination of information through popular social networks, expanding the reach of city hall's communications.
From Concept to Launch
This outlines the entire process of creating a website, from initial analysis and design to content creation, optimization, and training, culminating in a fully functional and optimized web presence.
Fluide intuitive navigation
Navigation offers a straightforward way to find information on the website. The logical and user-friendly categorization and quick access links for essential information, making it easy to locate specific topics .
Testimonials
City Hall
of Saint-Ouen-Marchefroy
La Mairie de Saint-Ouen-Marchefroy avait un réel besoin de communiquer avec ses habitants sur le plan des informations mais aussi au niveau des diverses réglementations.
Maria a su dès le début comprendre nos attentes et nous a proposé des solutions efficaces, créatives avec un sens de l'esthétisme qui nous ont donné la plus grande satisfaction. Le site est non seulement performant et beau mais facile d'utilisation pour nos concitoyens. Je recommande vivement Maria pour son excellent travail.
Nous avons eu un réel plaisir à travailler avec Maria. Sa faculté d'écoute, sa rigueur, son professionnalisme ont fait que nous nous sommes sentis en confiance dès le début. La Mairie avait besoin d'un site web attractif et facile à utiliser, l'objectif a été atteint au-delà de nos espérances. Nous sommes extrêmement satisfaits du résultat.
Philippe Dumas
Maire de la Commune de Saint-Ouen-Marchefroy
City Hall
of Saint-Oun-Marchefroy
Maria a construit le site de la mairie. En plus d'être très agréable, réactive et disponible, elle a tout de suite compris nos attentes et a su répondre aux besoins en nous proposant une solution simple, élégante et efficace. Elle a anticipé les problématiques qui nous avaient échappé.
C'est une personne de confiance et pleine de ressources, un profil rare !
Julie Destouches
Collaboratrice. Journaliste, autrice, conférencière, attachée de presse.