Boise State Webpage and Infographic Redesign

While not as awful as the printer in Office Space, Boise State Online's "About" web page just didn't work. The page was text heavy, the template was outdated, and the infographic fell flat (and we're not talking the trendy, design-y kind of flat). The page was a perfect subject for my Workplace Communication Task project in ENGL 511.

The project was a practice in analyzing a rhetorical situation and formulating a response. After completing market research, I updated the page's layout, text, infographic and map, and then revised the page further after receiving feedback. And unlike that office printer, no baseball bat required. Read my full project reflection below.

Artifacts

- New "About" web page
- Original "About" web page

- New infographic (PDF)
- Original infographic (PDF)

Boise State Webpage and Infographic Redesign Reflection

For my Workplace Communication Task project in ENGL 511 - Rhetorical Theory for Workplace Writers, I redesigned the “About” web page for online.boisestate.edu. In this reflection, I’ll explain the changes I made and the research that supports those changes. The new “About” page can be viewed at online.boisestate.edu/about, and the original version (accessible only via direct link) is at online.boisestate.edu/about-test

Rhetorical Situation

The online.boisestate.edu website is the student-facing side of Boise State Extended Studies. The page contains extensive information about the school’s online degree programs, as well as study tips, and more information about online learning. Typically, prospective students use the site to gather information about Boise State’s online programs or to apply to the university’s online degrees. An Extended Studies employee created the website as a side project to her normal day-to-day work duties. Although the site is well put together, she didn’t have all the tools or the time she needed to give all the pages the focused attention that this assignment allowed. I decided to work on the About page of the site (at my boss’s suggestion), intending to rewrite and reorganize the content, redesign the infographic and make the interactive map more informative. My intent is to make the page more engaging and to provide information that’s valuable to prospective students in a fashion that’s easy to read in a digital format.

Design/Content Choices and Assessment

Page Layout

Problem: The page layout is not engaging
Solution: The page layout may be the most challenging element, due to Boise State’s restrictive template—there are only so many page layout options to choose from, which helps the university keep a cohesive look across all university webpages. I changed the page to a different version of the Boise State template, which includes a full width image across the top of the screen and text on top of that to make it look more current and engaging, and to include a clickable Call to Action for searching the programs. Unfortunately, there are not many options for giving the page a more modern look beyond what I did, due to template restrictions. I also added icons to the top of the screen, tried to include more bullets and bolded information in the text-heavy sections to make the page more skimmable. These changes also make relevant points easier to see for those quickly scanning the page.

Text Shift

Problem: The information is not relevant to students
Solution: I consulted marketing research from the Education Advisory Board (EAB), Carnegie Communications, University Professional & Continuing Education Association (UPCEA), and spoke with our Student Success Coaches to find out what type of information students are looking for when they search for schools, and what questions students ask when they’re still in the exploratory stage. The marketing research said that students want to know how a degree is going to bring them value—what it will provide them with, the assurance that it will provide legitimate value, and that the institution is reputable. My research also said that prospects want marketing text to use the term “you” vs “student” to make it more personal. Success Coaches said students are largely concerned about the cost of school, knowing that the program is reputable, and whether the programs are flexible to fit their lives. With this information in mind, I rewrote the text to more clearly show the value of the programs and that Boise State is a reputable institution by better describing the school's accreditation, talking about the faculty and adding quotes from actual online students.

Appearance Shift

Problem: The old version of the About page was text heavy, with dense paragraphs that were difficult to skim.
Solution: I added three icons at the top of the page, which focus on some of the main points of value about the degree: the cost, the support, and the flexibility of the programs. The icons help people see and absorb these important points quickly. I also broke up the text later on the page and rewrote it with headers and bold text as visual waypoints, making it easier to skim.

Infographic

Problem: The infographic had potential be more visually inviting and engaging.
Solution: I kept the same information included in the old infographic, but transformed it to be more visual and taller. Recent research cited in a Prototypr article titled “How To Use Scrolling To Fight Increasingly Lower Attention Spans and Skimming Behavior of Users,” shows that users favor scrolling and skimming. Keeping this research in mind, I made the infographic into a tall, scrollable format. The tall format spread the information and allowed for varied font sizes and a more dynamic layout, with icons of varying sizes and more emphasis on certain points of info to draw viewers in. I also created an accessible text alternative version for the website.

Map

Problem: The map shows student location by grad/undergrad, but doesn’t include any division by program—something that Success Coaches reported students would like to see. I also wanted to embed the map in the page so that it would be interactive and searchable without leaving the site.
Solution: Using data from the 2017 Census Day Report, I updated the information on the map to include all online students from Fall 2017. Unfortunately, due to the limitations on Google Maps, I was unable to add each group of students by program. Currently the students are only divided up by graduate and undergraduate, but if I become aware of a more data-friendly map in the future I’ll update the site. Regardless, including location data on current students makes the University’s online programs seem more accessible and personally relevant to prospective students. I also embedded the map in the page, so that rather than a static image, visitors can click around and zoom in on their region without ever having to leave the boisestate.edu domain.

Strengths/Weaknesses

I feel I moved the About page forward by transforming the text and making the graphic elements more engaging. By using a different version of the template, the page looks more current. With the proper tools and time, I was able to make the infographic better, and although I didn’t achieve all that I’d hoped with the map, my failure was due to software limitations and not my inability to crunch data.

In comparing the Boise State Online About page to online programs at other schools, I do feel it’s lacking. The less-desirable look is partially due to the Boise State template. I also wish we had more outcome-related statistics like XX% of grads get jobs after completing their degrees. Unfortunately, since many of the online programs are so new, we don’t yet possess these statistics. One element that I would like to (and could) add is one or two student quotes, or a student testimonial. I simply didn’t have time to do add quotes, but we plan to add those elements to the online site in the future. I would also like the Student Success Coaches to look over the page and give me feedback or revisions.

What I Learned

The biggest learning experience I had was that through intentionally considering the audience and deliberately making choices with that audience in mind. Although I did consider my audience in a more abstract way prior to taking this class, it is helpful for me to make conscious choices with the audience in mind. Keeping the audience in mind helped target my research and refine my revision methods, and it made me feel empowered and informed while I made decisions. In retrospect, considering audience is kind of obvious, but didn’t have an organized way to approach problems previously, and applying even the most basic heuristic helps tremendously. (This heuristic was covered extensively in Chapter 1 of A Strategic Guide to Technical Communication.)

The other helpful piece of learning from this semester was in my technical editing class. We have talked a lot about using plain language and how important plain language is to make a document or text more understandable or relatable. I was able to apply these concepts in transforming the text, and I took out the educational jargon and hopefully made the text more personal and readable.

I also learned (or more accurately had reinforced) that even the best-laid plans can go awry. Although I spent a fair amount of time preparing spreadsheets with student data by program, and intended to make the interactive map searchable by program, as I uploaded the data I was faced with the limitations of Google Maps. The number of online programs far outnumbered allowable layers on the map, so I was unable to include that information.

Revision

Since web pages are infinitely changeable, it’s been handy to be able to make small changes to the page as necessary (and probably will continue to do so into the future). However, I did make some significant revisions based on user and peer feedback, and they are as follows:

Adding student quotes: My department has good quotes from online graduates who were initially worried about what learning online would be like and how they would fit school into their lives. The addition of quotes from real online students makes the programs more relatable, and helps potential students realize that they’re not alone in their concerns. I chose quotes that talked about the program’s support and flexibility, because those are some of potential students’ top concerns. The quotes also visually break up the page and encourage scrolling.

Revised verbiage: I asked the Student Success Coaches to look over the page and infographic and suggest revisions. Since the coaches talk to students and potential students regularly, they offer a valuable perspective. A number of coaches responded with minor revisions to the text, and I made those changes to better address potential student questions.

New photo: Previously the first photo on the page was of a Boise State student receiving her diploma at graduation. The subject was actually an online graduate who visited campus to walk in her graduation ceremony, but some classmates noted that the photo might not be relatable to online learners. My options were to add a caption or change the photo, and since a caption would clutter up the page, I decided to change the photo. There aren’t photos of adult online learners in the Boise State photo repository, so I found a stock photo of an adult on a laptop. I then Photoshopped it to reflect Boise State’s colors and added a Boise State logo to the subject’s t-shirt. This image will hopefully be more relatable for potential online learners.

Sources

Kataria, Maitrik. “How To Use Scrolling To Fight Increasingly Lower Attention Spans and Skimming Behavior of Users.” Prototypr, https://blog.prototypr.io/how-to-use-scrolling-to-fight-increasingly-lower-attention-spans-and-skimming-behavior-of-users-3926460700b0. Accessed October 20, 2017.

Graves, H. & Graves, R. (2012). A Strategic Guide to Technical Communication. Buffalo, NY: Broadview P.