Wayne State Web Team

Wayne State University Web Team Blog

Launch: Community Engagement website

(opens new window) (opens new window)

Community engagement happens all across the university. A large majority of students are engaged in the community and it's a big selling point for prospective students. Our problem was it was hard to communicate everything the university was doing when the content was disbursed across multiple websites.

# Centralizing content

Bringing a site like this together isn't easy. The prerequisite was to gather all the community engagement across campus, identify who maintains it, and get everyone talking. Without solving this information problem the website wouldn't be successful. Luckily the Government & Community Affairs (opens new window) department did an amazing job gathering and working to promote all community engagement around campus.

# First impressions, deep content

Getting someone to a website is only half the battle, let's imagine by some miracle a visitor lands on the homepage of this (or any) site. They basically have ten seconds, at the most, to determine (often subconsciously) if they are going to find the information they are looking for.

I use the term "find what they are looking for" because every visitor has a motivation for their actions. The notion of someone just "surfing the Web" I've never actually heard a user say as a motivation to visit a website.

# Balance

Too much content can turn a user away (information paralysis), too little information can leave visitors wondering if the site can actually fulfill their needs.

The balance happens when distinct information paths are separated by visual consistency and actions for the user to dive deeper. On the Community Engagement website we did just that.

# Visual cues

Building visual and interaction cues and keeping them consistent is essential to building confidence in visitors. We accomplished this on the Community Engagement website with three main elements:

  1. (opens new window)Green-banded headers - These areas immediately call attention and by using them sparsely we direct visitors to areas that offer more information. Some of them wrap around their container which call even more attention because it introduces an angle to break up the visual squareness of the blocks.
  2. (opens new window)More information arrows » - Keeping the construct of a forward-moving user experience and the way a user would turn a page in a book (or swipe right to left), the idea of an arrow pointing right gives the visitor a feeling of "advancing the page". We wanted to keep this consistent throughout the website. Anywhere a visitor sees a single or double arrow they can click to read more information on a different page.
  3. (opens new window)Dots to expose more information on the same page - Since we can't fit every piece of information on the homepage we have to hide some. To give the visitor a cue that there is more information to explore, we use dots. The number of dots show how much content is hidden and what else the user can explore with low barrier to click since it will be exposed on the same page with a low loading time.

The website encompasses so much more than just the visual cues and user motivations I've highlighted above. I just wanted to give some insight into some of our decisions and the motivations behind them.

Explore the new Community Engagement website at: http://wayne.edu/communityengagement/ (opens new window)