PTEN
← All case studies
UX/UI DesignInformation architectureResponsive webClient project

FAPAM

Community, information and student recruitment in a single digital experience.

My role
UX/UI Designer: information architecture, flows, wireframes, UI, prototype and handoff
Client
Faculdade de Pará de Minas (college)
Platform
Web · desktop and mobile
Result
+40%website visits after launch
Home · desktop
Home of the new FAPAM website: admissions banner, events calendar and program types
02 — Challenge

From two digital products to a single experience

FAPAM had a student portal and an enrollment landing page, kept separate. The new website had to serve people who already study there and people who are still deciding.

Before

Student portal

Services · activities · links

Before

Enrollment landing page

Recruiting new students

After

One institutional website

Inform, make services easy to reach and attract new students.

How do you inform, make services easy to reach and, at the same time, attract new students?

03 — Audiences

Four audiences, two goals

Community → experience
  • StudentsServices and quick access
  • ParentsPrograms and campus life
  • FacultyInformation and resources
Recruitment → conversion
  • Prospective studentsYoung people choosing a career

Experience: information, belonging and services. Conversion: leads and enrollment.

04 — Benchmark and architecture

Organizing a lot of content without losing the user

A benchmark of other institutions: menus, program categories, hierarchy and paths to enrollment. The result became the site's navigation structure, with a main menu for recruitment and a secondary menu for the community.

FAPAM navigation structure chart: the website splits into Faculty Portal, Student Portal, a secondary menu (Services, FAPAM Social, Library, About FAPAM) and a main menu (Admissions, Programs, Graduate Programs, Research and Extension, Campus Life, News)
Navigation chart: a main menu for people still deciding, a secondary menu for people who are already part of it.

Navigation principle

Enter→Find→Dig deeper→Go back→Keep going
05 — The balance

Information without overload

Inform←→Convert
Institutional←→Commercial
Current student←→Prospective student
Depth←→Ease

The answer: strong hierarchy, interface patterns, clear CTAs and fewer decisions per step.

06 — Decision: a home page about belonging

The home page shows what happens inside FAPAM

Instead of only showing what the college offers, the home page opens with the marketing campaign and then brings in the calendar and events: fairs, keynote lectures and community initiatives.

  • 01Students. Taking part and a chance to see themselves in the content.
  • 02Prospective students. A feel for what it's like to be part of the community.
  • 03Parents. A view of everyday life on campus.
  • 04Faculty. A showcase for the institution's initiatives.
Event page: the 1st Social Entrepreneurship Fair of Pará de Minas
Event page: hover to scroll.
07 — Decision: journeys with their own identity

Same system, different feelings

Undergraduate · light theme

Friendly and approachable: an easy transition from high school.

Undergraduate programs page in the light theme

Graduate programs · dark theme

Darker and more high-end, associated with technology and specialization.

Graduate programs page in the dark theme, with specialization courses
08 — From discovery to enrollment

A progressive decision journey

Home→Get to know FAPAM→Explore programs→Choose a program→Program page→Lead / enrollment

The program page as a “second home page”

Is this where I want to study? The page doesn't just explain the program: it helps prospective students decide, and ends with a clear action.

  • 01About the program
  • 02Facilities and labs
  • 03Faculty
  • 04What sets it apart
  • 05Alumni testimonials
  • 06CTA · Apply now
Business Administration program page with an overview, curriculum, highlights, faculty, testimonials and an enrollment CTA
Business Administration program page: hover to see the full scroll.
09 — Consistency

Users don't relearn the interface on every page

Navigation

Adapted to each context, desktop and mobile.

CTAs

Always visible on every page.

Patterns

The same components across the whole site.

Menu component with the Programs dropdown open: Undergraduate, Graduate, Research and Extension
Program card, light version
Program card, burgundy version
Admissions exam card
10 — UI

The same brand, lighter in digital

The identity already existed. The work was adapting it for reading lots of content: red only as an accent, and white space to breathe.

WhiteBase
GraysSections
TextReading
BurgundyBrand
OrangeAccent · CTA
11 — Results

The experience became numbers

+40%

more website visits than the previous version.

Enrollment

Significant growth in enrollments coming from organic Google search, with the website as one of the main student recruitment tools.

Video testimonial (in Portuguese): Prof. Reinaldo Galvão, head of graduate programs at FAPAM, talks about how the project began and the new website's impact on the college's results.

Watch on Instagram ↗

A closely followed handoff with the development team to preserve the UX and UI decisions.

12 — Learnings

What I would do differently

I would adapt the brand even further for digital: less red gradient, a flatter visual language and a softer palette.

What I take with me

Architecture→Navigation→Journeys→Interface→Business

Think about the whole product, not isolated pages.