Wisr (pronounced wī-zur) builds networks that connect the students and alumni of over 40 universities. Most partners use these networks to engage alumni in helping students explore careers.
I worked with the engineering team to design and build a discussion forum that’s easy to use but flexible enough to support diverse use cases.
Wisr (In-House)
Balsamiq, Sketch, Invision, React
Kris Ciccarello (Back-End)
TJ Breslin (Back-End)
Justin Smith (Front-End)
Wisr launched with robust tools for one-on-one conversations. While these suited students who needed very specific advice, feedback surveys showed that many students were asking the same questions in private conversations.
We needed to build a forum where students and alumni publicly could weigh in on popular topics. Meanwhile, we would also accommodate new use cases like sharing internship opportunities or searching for roommates.
Customer Interviews
Competitive Analysis
Rapid Prototyping
User Personas
I began exploring sample topics by browsing university pages on Facebook, Switchboard, and College Confidential and—to round out the list—discussed potential uses with partner administrators. The most popular applications included:
- Facilitating Q&A for applicants and their parents
- Connecting groups of first-year students with mentors
- Discussing academics (projects, homework, grading)
- Sharing work and housing opportunities
The remaining question: flat or nested? Flat discussions always show posts chronologically, while nested discussions order posts by placing replies under their parents.
Flat discussion structure—posts are in chronological order
- Smoother reading experience
- Threads feel more in-the-moment
- Reply appears where expected
- Discourages irrelevant tangents
Nested discussion structure—posts are ordered by conversation structure
- Nonlinear reading experience
- Threads can feel more stale
- Creates more interface complexity
- Facilitates more nuanced discussions
In the case above, a nested structure doesn’t seem so bad. But, things quickly get confusing when complexity increases:
Flat means replies lose some context
Nested can give readers a headache
I built a clickable lo-fi prototype of each structure with some hard-coded posts and replies to let the team test which felt more natural.
Dozens of solutions to the discussion problem exist, and each one is optimized for different use cases. Mine maximizes flexibility, accommodating institutions with different needs.
The forum design I settled on combines elements of flat and nested structures, essentially housing every reply in two different places—where it appears in chronological order and directly under its parent—but collapsing it by default in the latter.
To add context to a reply, a post shows a truncated sample of its parent when it doesn’t appear directly below that parent.
Thanks to foundational research defining user personas, I knew many students would be using the forum on mobile devices. I designed the interface mobile-first to ensure mobile users didn’t become an afterthought.
Some other key features included:
- Rich text editor to allow styling and media embedding
- Notifications for direct replies and digest for relevant activity
- Flagging system to notify administrators of inappropriate content
We adapted Basecamp’s open source Trix editor to support a variety of text styles, image embedding, video embedding, and hyperlinking.
To date, Wisr’s discussion forum has facilitated thousands of conversations for students and alumni at over 40 universities. Here are three of the implementations I’m most excited about:
- The University of Chicago is using the forum to introduce every cohort of incoming first-years to their peer advisors.
- Alumni chapters from Saint Michael’s College are using the forum to coordinate regional events and fundraisers.
- Alumni at Oberlin College & Conservatory have created field-specific communities to share relevant job and internship opportunities.
Wisr’s discussion forum in the wild, helping alumni of Oberlin College & Conservatory share career opportunities with undergraduates
This was the first feature I worked on where I spent a significant amount of time writing React—with plenty of help from Justin, our lead front-end engineer. Learning React was awesome, and working on the forum made me appreciate the value of breaking up complex features into self-contained components.
Coming to a consensus on the forum’s structure (i.e. flat or nested) for both the interface and database was a huge hurdle. At the time I was tempted to dive into wireframing, but—seeing the final product—I’m glad we took it slowly and built on a really solid design concept.