efpp website redesign ipad and phone mockup for homepage

EFPP

Visual IdentityWebsite Design

CLIENT

EFPP – European Federation for Psychoanalytic Psychotherapy

SCOPE OF WORK

  • Logo Refresh
  • Visual Identity
  • Iconography
  • Infographic
  • Information Architecture
  • Website Design
  • UI/UX

TEAM

  • creative direction & design – Sofija Marjanović
  • web development – Stefan Trbojević, Predrag Stefanović
efpp logo refresh black on white background

logo refresh

EFPP used the same logo design for a long time. it was originally designed only with the print application in mind. EFPP needed a new version of the logo – modern and easily applicable to both print material and digitally.

efpp logo redesign

the colour palette was also refreshed.

efpp visual identity colour palette violet and yellow colours

efpp website redesign ipad and phone mockup for homepage

website revamp

EFPP initially came to us because they needed help with the new website design. but after a few meeting we agreed they needed a complete website revamp and a new web application. EFPP needed a platform that will enable them to promote and expand their message as one of the world’s leading organisations for Psychoanalytic Psychotherapy.

efpp website redesign - sitemap

the most challenging part of the project was the reorganisation of the content from the old website. the old website was difficult to navigate and was very content heavy, but most of that content had to stay on the new website. so the task was to reorganise that content for the new website while also making sure to provide a good experience for the users.

efpp website redesign - user flow chart

since some of the pages were hard to comprehend, a portion of the content was transformed into downloadable PDF files for easier navigation. For other pages, new content was created to make the information easily readable and summarised.

efpp website redesign - all website pages presented side by side with animation

goals

we discussed who are the main and potential users of the website. but we also discussed what are the main goals EFPP wanted to achieve with the new website. based on those inputs, we made a new content structure, with each website page having strategic goals.

efpp website design navigation design

navigation

we decided to use a few different navigation systems. firstly, we added clickable breadcrumbs below menu header. secondly, along with showing the submenu items on hover, each menu item on click opens a page with cards for every submenu item it contains. each card has a short description of the content that can be find on that page. each page, above the footer area, has a Suggested Pages section with manually selected suggested pages.

efpp website design - three full website pages

features

some of the features of the website are: the clickable map with all the EFPP members; the event calendar; and the event page.

efpp website design member page with members listed and shown on an interactive map

map

hover on each of the country opens a tooltip with the list of member organisations from that country. each organisation is marked with a colour that represents the type of it’s membership. click on each country on the map will open a new page with detailed list and information about all the members from that country.

efpp website redesign - one of the web pages demonstrated on a mac laptop

below the map, there is also a list with all the countries that have member organisations.

efpp website design - events page with a filter for type, organiser, year and more

the event calendar

events are the most important activity that keeps the EFPP, but also the whole psychoanalytic psychotherapy community, together. we designed a simple calendar for the events, with the most important information clearly visible. the filter above the event list provides easier navigation for finding the desired event using different categories.

efpp website design event page detail

each event from the Event Calendar has a separate page that describes the location, the topics, and the scope of each event, along with the map and the supporting downloadable material.

organisation infographic design for website design project

infographic of the EFPP organisation structure

set of icons for website design, pin, calendar, web and files download icons

iconography

efpp logo refresh black on transparent backgound