Product design · CU Boulder

Making student resources findable

Student Affairs was writing genuinely useful articles. They were going out by email, where almost nobody read them.

jump to the solution

Context

Delivering content where students already are

CU Boulder's Student Affairs team publishes content on academics, wellness and campus life. Distributed through campus email, it had low visibility and lower engagement. The task was to integrate it into Buff Portal, the dashboard students already open for schedules, grades and financial aid.

This was a fast-paced project: collaboration, rapid prototyping and usability testing inside a short window.

The Buff Portal dashboard, a grid of cards for academic and campus services.
The existing product. Buff Portal is where CU Boulder students already go for registration, housing and finances. Any new content had to earn a place in this grid rather than ask for a new destination.
Role
Product design, visual design, strategy
Timeline
July to September 2024
Research
16 student participants, remote usability testing

The problem

Low visibility, and no reason for a student to look

Students were not ignoring these resources because the resources were bad. They were ignoring them because they were buried in an inbox, underneath content that was not relevant to them, with nothing tying an article to what that particular student was actually dealing with.

Buried in emailArticles arrived in campus newsletters that most students never opened, competing with everything else in the send.
Not personalisedEveryone got the same content regardless of year, programme or situation, so most of it was irrelevant to most readers.

Desired solution: put the articles inside Buff Portal, where students already go, without disrupting what they came to do.

Project goals

Three things the integration had to achieve

Increase visibilityMake Student Affairs content easy to find
Enhance engagementEnsure articles are relevant to a student's academic and personal interests
Improve UXDeliver content without disrupting the Buff Portal flow

User research

Co-designing with 16 students rather than designing at them

With a limited timeframe, the fastest way to good ideas was to get them from the people who would use it. I moderated a collaborative session with 16 CU Boulder students, supported by the Buff Portal UX team.

01Context setting. Students were introduced to the visibility problem and shown how their input would shape the design.
02Design activity. Participants sketched their own solutions for integrating articles, focused on personalisation, accessibility and engagement.
03Feedback and discussion. Students presented their ideas, critiqued each other's, and voted on the most promising directions.
Session board with sticky notes under Desktop, Mobile and Quantity and Timing columns.
The session board. Three columns, because those were the three open questions: what it looks like on desktop, what it looks like on mobile, and how much content is too much.
The same board filled with student-drawn wireframes.
What the students drew. Sixteen students sketching their own answers. Most put the content inside an existing card rather than giving it a page, which settled the biggest question before I had drawn anything.

Wireframing

Two directions, built to be tested against each other

The initial wireframes outlined structure and flow, and went through several iterations. Rather than converge early, we deliberately carried two distinct versions forward so students could react to a real choice.

Wireframe of the article card in list and detail states.
Direction one. Latest and saved articles in one card, with the article opening in place. Saving is the primary action, on the theory that students triage now and read later.
Wireframe of the card with topic filters across three states.
Direction two. Topic filters promoted to the front of the card, so a student narrows before browsing. More control, more to understand.

Final prototypes

Extending the existing system, not bolting onto it

Both high fidelity versions followed Buff Portal's existing design framework, while adding components to the shared library that other teams could reuse afterwards. Integrating into an institutional product means your work has to survive the next person's feature.

The article card in the live dashboard column, alongside academic cards.
In context. The card sits in the same column as registration and housing, using the same type, spacing and gold rule. Student Affairs content reads as part of the portal, not as an advert inside it.
An article opened inside the card, with an image and a read action.
Opened. The article expands in place rather than navigating away, so a student who is mid-task on the dashboard does not lose it to read two paragraphs.
The full dashboard with the articles card among the other portal cards.
The whole dashboard. The test for an institutional product is whether you can spot the new thing. If it takes a moment, it belongs.
The articles card on a phone, inside the mobile portal.
Mobile. The same card, stacked. Topic chips wrap instead of scrolling sideways, because the co-design session showed students would not discover a horizontal scroll here.

User testing

A second round of feedback on the real prototypes

We ran remote testing over video, walking students through the working high fidelity prototypes and noting what they did as well as what they said.

Every comment went into a structured table, then got analysed to identify which version students preferred and what still needed changing. Two rounds of student input, at the idea stage and at the prototype stage, is what made the recommendation defensible.

Spreadsheet holding the usability testing script and every participant response.
The testing script. One row per task, one column per participant, so the comparison between the two directions was a reading of the sheet rather than a matter of whose memory of the session was loudest.

Reflection

What this project taught me

The instinct on a visibility problem is to make the thing louder. The better answer was to move it somewhere it made sense, and to let students tell us where that was. Sixteen people sketching for an hour produced more usable directions than I would have reached alone in a week.

Working inside an established institutional design system was the other lesson. Adding to a shared component library, rather than designing a one-off, meant the work kept paying off after the project ended. It is the same reason I now build component libraries rather than screens.

Next project
Vocali, making long podcasts searchable