top of page

Web and mobile redesign

A redesigned Sea-Eye Participate website section with a refreshed design. 


Sea-eye is an association for the rescue of fleeing people in the central Mediterranean.


During the UX-Design course I choose to redesign the aspect of the webpage of a charity I support.


I decided to redesign the "Participate" section of, to give it a more organized and linear design, and also I tried to add some new features to give the website a modern aspect.


Role: UX Designer

Timeline: aug23-oct23


Adobe XD


Users interviews

Competitive and comparative analysis

Usability tests


A refreshed website without the accessibility problems it had before.

User research

I conducted some research to fully understand the target users of the client. After that, I grouped them in two user personas to point out their needs and the pain points they have while using a charity website.  In particular I focused on the "Join us" process, considering that on the Sea-Eye website the navigation has been defined by users a little confusing. I realized a competitor analysis to understand their strenght and their weakness about their presence on the web.

User Persona:

_Yellow Professional Gradient User Persona Company Presentation (1).png

User persona: Jannik

_Yellow Professional Gradient User Persona Company Presentation.jpg

Usability study: findings

  • Most of users don't like the language setting.

  • Part of users feel confused about the onshore page. They found it too full of information.

  • A part of users want to see more images or videos to know about the charity more in-depth.

I conducted a moderated usability study with 6 people: 3 females and 2males from 25 to 35 years directly on the main website. The main findings are:

Starting the design


I started off with some sketches to understand how the various components may be disposed across various screens. 


Digital wireframes

Using Adobe XD I started to develop low-fidelity wireframes, designing for smartphone and tablet as well. 


Final Design

The hoverable buttons chosen on the header didn't pass the color contrast checker. I modify them with a design in which they are only underlined, improving the accessibility. Moreover, a language bar has been added. 

I also modified the general aspect of the main section, inserting videos instead of photos to draw the attention of the users.


Presentazione senza titolo (6).jpg

An interactive image has been added on the offshore page to show the ship roles, instead of another collapsible menu.

The footer has been minimized, inserting social media icons.

Presentazione senza titolo (7).jpg

An interactive image has been added on the onshore page to show the local groups, giving the user the opportunity to immediately visualize in which state they can be found  instead of many images.

The contact person section has been enlarged and centered.

Presentazione senza titolo (8).jpg
Screenshot 2023-10-03 123048.png

High-fidelity Prototype

What I learned

My primary goal was to streamline the participate section of, maintaining the essence of the existing website. The inclusion of videos will allow users to better understand the purpose of the onshore and offshore crew.  

I developed a design strategy that focused on giving the website a better usability, considering the changes I made about the language bar, the header and the footer.  

Thank you for visiting my portfolio!

Let's connect

Feel free to give me your feedback or to contact me to get in touch.


bottom of page