The Road to Redesign: Applying UX Strategies to Handle Skeptical Speed-bumps
•Download as PPTX, PDF•
1 like•470 views
This UxPA-MN presentation guided viewers through the redesign of Metropolitan State's online student orientation. The year-long project provided opportunities for user research and testing and lessons for gaining support from a skeptical constituency.
The online orientation redesign involved coordination of resources across departments, a challenge in itself, and proved to be a sensitive point for many of the subject matter experts involved. I used information gained from surveys, job shadowing, and usability testing to inform responsive design, content strategy, pathway, and also to prove to a skeptical and emotionally invested constituency that the five-year-old website needed to be updated.
1 of 36
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
More Related Content
The Road to Redesign: Applying UX Strategies to Handle Skeptical Speed-bumps
1. The Road to Redesign
APPLYING UX STRATEGIES TO HANDLE
SKEPTICAL SPEED-BUMPS
Meghan Hatalla, Century College
2. What you need to know about
Metropolitan State University
3. The University Without Walls
• Founded in 1971
• Centered around adult, working students
• Committed to community involvement
8. Prospect Admitted
Credit evaluation
New Student Orientation
Applicant Registered
10. Online Orientation Redesign Group
Leader
AVP of Enrollment Management
Technical people
Student Affairs Web Strategist (me)
Academic Affairs Web Strategist
Center for Online Learning
Information Technology
Subject matter experts
Academic Advisors (3)
16. Task 2: Define our users
• Library shadowing
• Students can navigate web sites
• But not troubleshoot why a .docx won’t open
• Recent online new student orientation survey
• 11% response rate
• Loud & clear…
17. To what extent did Online Orientation help you
contact your academic advisor or advising center?
18%
43% Not helpful
Helpful
Very helpful
39%
18. I generally...
100%
88%
90% 82%
80% 73%
70%
60%
50% Not true
40% Neutral
30% Very true
20% 15% 12% 15%
10% 3% 6% 6%
0%
Skim over details & dig deeper Return and read things when I Like to know the big picture
into important details need them
19. On a scale of 1-4 (1=easy, 4=difficult), how easy was it
for you to complete orientation in D2L?
21%
33% 1 = easy
2 = Ok
3 = a little difficult
13%
4 = very difficult
Didn't complete orientation
6%
27%
20. Design is a funny word. Some people think
design means how it looks.
But of course, if you dig deeper, it’s really
how it works.
- Steve Jobs
21. Answer Me These Questions Three
1.What is this site for?
2.What do you like or dislike about this site?
3.What do you do next?
27. How have browsing habits changed?
According to Pew Research, from 2007 to 2012...
80%
70%
60%
50%
40% 2007
30% 2012
20%
10%
0%
Broadband at home Using Internet Explorer Own tablet / smartphone
28. ...the web’s moved beyond the desktop, and it’s
not looking back.
- Ethan Marcotte
29. We need to
tell them
EVERYTHING
they may ever
need to
know.
30. You will have to deal with new platforms that
you haven’t yet heard of, and being agile with
your content is more important than picking a
platform or two and building for them.
- Karen McGrane
31. I don’t see a problem.
Didn’t we just
design There are too many
orientation 5 competing priorities.
years ago?
Why do we need to do
things differently?
32. What
students
need to
know
What
students
need to do
36. Thanks =]
Meghan Hatalla, Century College
Twitter: @megtalla | Linkedin: /meghanhatalla
Editor's Notes
I have something to confess—not only is this my first time speaking at a UxPA MN event, it’s my first time at a meeting ever. So I’m doubly excited to be here tonight, and I was telling my friends about it, and what I was going to be speaking on. And one of them—her name is Sara—Sara looked a little confused, and said ‘Oh…I didn’t realize that Metro State was, like, a real college.”
So in case some of you out there are also unaware that Metro State is, in fact, a real college, we’re going to go over some basic facts about Metropolitan State University.
Part of Sara’s confusion might have stemmed from Metro’s background. It was founded in 1971 and was known as the university without walls because it didn’t have a campus in the traditional sense, classes were held around the twin cities in businesses or they co-located with community colleges.It was also an upper division university, so students had to be at least juniors or seniors to attend, and many of them also working full time. Students designed their own degrees and gained credit for work or life experience. And as an urban university, Metro has always had a strong sense of community, which is reflected in their mission to ‘serve the underserved’
So, while a lot of those things are still the same—like the ability to design a degree program, gaining credit from life experience, some other stuff changed. There are now four established campuses, here in St. Paul but also Mpls, Brooklyn Park, and Midway.Metro became a part of the Minnesota State Colleges and Universities system in 1995, which helped build stronger connections with community colleges.
Students at Metropolitan State range in age from 16 to 75, with an average of 32 years. The majority of the student body is nontraditional, and Metro’s been doing nontraditional since before it was a thing. Nontraditional is an outdated term, but for lack of another oneHowever, this also means that technical skills are all over the map. Over 90% of the student body have previously attended college elsewhere. With transfer students come transfer credits and the average number that needs to be processed is 65 credits per student.The average at the next highest transfer institution is about half that, with maybe a quarter of their populations transferring in, so that adds up to a lot of credits that need to be processed before a student registers for classes. Introduce “Bill”.On top of all of this, Metro students are working full time or almost full time. They don’t want to be on campus any more than they need to, and they don’t want busy work.
Maybe you know this or maybe you don’t, but the number of students graduating high school is on the decline, which means that the main way to encourage new enrollment at universities is to go after adult learners, or nontraditional students. This is nothing new for Metropolitan State, because we’ve been doing this for a long time. In fact, one of ways that people hear about Metro State is via positive word of mouth. Jim got his bachelors from Metro State, thought it was great, and tells Sue, who enrolls, likes it, and passes it on. But we learned is that there’s a caveat with this word of mouth promotion:
And this is the thing. Metro is great, once you get in. So, what does this mean exactly?
In 2010 Student Affairs put together something called the Entering Student Pathway Group. The entering student pathway is defined as basically the journey from prospect, or the first time someone hears about Metro State, to applying, to admission, and finally registered for classes. We did a kaizen, which is basically a process improvement exercise. Describe Kaizen.Role play as Bill. In 2010, it took almost 2 months for an admitted student’s credit evaluation to be completed. Sometimes they completed orientation in that time, but since orientation was touted as being the step just before registration, they wanted to wait for their credit evaluation first.
My former boss, Drew Melendres, AVP of Enrollment Management, compared the problem to a leaky bucket. As more students are admitted, the water level rises, and more and more leaks start springing out. Students weren’t getting the information they needed in a format that was usable or timely, so they just didn’t register and went somewhere else. We came up with a lot of recommendations, but we discovered that we really needed to revamp new student orientation, which is where a lot of these holes came from. And that is how we arrived at the decision to redesign new student orientation.
I mentioned earlier that the Entering Student Pathway was primarily started by Student Affairs, but lots of people across the institution were invested in different ways. When the process began to redo the site in 2012, the redesign group was fairly small, and we were very lucky to have a leader who shielded us from a lot of the external politics so that we could put our heads together and get through the work. The people involved with the construction of the site were chosen for strategic reasons. Obviously, IT was involved for their technical assistance, and the Center for Online Learning for the same reason. The advisors were asked not only for their knowledge of what new students need to know, but also because they were heavily invested in the process of the old site. The input and buy-in of the whole constituency was pretty crucial to the success of the site—even if we built the most amazing, inclusive, orientation site ever, if we didn’t have support from other divisions, it wouldn’t fly. Other great initiatives have failed at Metro for less.
But it was one thing to say Hey, we need redo this whole thing, and another thing to organize the entire process and get people to understand why we needed to do this. When we began conversations around redesign, this comment popped up in a few circles:The old site was the first thing that we needed to really dissect and analyze and burn.
Ok, not literally obviously. I like this quote because in it’s mixed metaphor kind of way shows the value of using something that came before in creating something new. We did dissect it pretty thoroughly to see where the problems were hiding.
Or maybe they weren’t really hiding. This is a screenshot of the old site. It was made in 2007, by committee and there are a lot of different things going on here. We have this scroll bar list of things that students need to do, which is also part of a larger list of things they need to do. But to start doing them, they need to click up here, which takes them off of this page. And when they click on these, it takes them to a different tab set with a whole list of other pages under each tab. Oh, and after you go through all of these, we’re gonna need you to go BACK into content you’ve already read to do some more stuff. And then we want you take a quiz, but you’re going to have to log out of this and go somewhere completely to do that. It’s a learning management system called Desire 2 Learn, or D2L, and our findings later found some issues with that, but hold on. Because now you should be ready to register for classes, and, yeah, that’s an entirely different system, too. Unless you don’t have your credit evaluation, then you might want to wait. Mmmkay? Is that cool? Oh, and if you’re using anything other than Internet Explorer, you’re probably going to want to switch.
Right? So we decided that we needed to begin at the beginning, to quote the Mad Hatter. Which really means that we had to redefine who the users were.
Another common preconception from the other divisions was that there wasn’t any kind of problem with orientation. This speaks to the lack of communication and information sharing between divisions. Cold calling - the issue was that they didn’t know where to call. Through the entering student pathway, we found out that it was a common issue in other divisions as well.We needed to find out how and where our students are coming to conclusions, and what their level of proficiency was.
So who is this for? We did some different fact finding, starting with shadowing our librarians. That might sound weird—But what we found was that, for the most part, our students were pretty savvy when it came to surfing the web, but less savvy when it came to multiple step operations, like downloading or uploading files, logging in and out of systems, etc. The other helpful thing we did was send a survey to students who registered for online orientation—we got a 11% response rate, not too bad for a pretty lengthy survey—and some really clear direction to take.
43% respondents said that orientation did not help them know how to contact their advisor or the advising center. What this says to us is that they don’t know where to go if they have questions about their academic career, hence the massive calls coming in from everywhere.
From the screenshot, you can probably guess that there was A LOT of information in the orientation site. And it’s not to say that the information is bad, or irrelevant—it’s just not what they’re looking for, and that site was DEEP. Like, students were going down rabbit holes of information without being entirely sure what or where they were going.
OMG right? Yes 39% didn’t report a problem with having to log into a different system to fully complete New Student Orientation. But 40% reported some level of difficulty, and then another 21% DIDN’T EVEN DO IT. They decided to register for on campus orientation, or just decided not to register at all. Jared Spool wrote a great blog post on the cost of frustration, and the costs of a difficult process. This 21% magnified adds up to a lot of students quitting, and a lot of lost tuition dollars.
So now that we had an idea of what we need to fix, we moved into content and design phase. I’m not a huge Steve Jobs fan, but I really like this quote especially in this context. We have a user base that will use our product, but we need to make it work for them, and provide them with the right information. Since we’re a university with limited funding, we decided to do some paper prototyping. I gathered together some screenshots of different online orientations, and in exchange for a Metro-branded water bottle, we asked students a series of questions. I created a script based off of the one provided by Steve Krug in his book Rocket Surgery Made Easy—everyone here knows Krug, right?—and in short, we asked them to look at each screenshot, and tell us 3 things:
First site. One of our fellow MnSCU partners. They did not like these instructions in the Welcome—they thought it was a little elementary, like the directive to use a modern web browser—and they weren’t going to read them. They also did not like the Getting Started section, which kind of confused them by replicating buttons that appear elsewhere. They DID like the next button—it was clear as crystal what the next step was.
What people liked and disliked about this site were, oddly enough, tied together. They liked how clear the steps were laid out, but not the amount of text with each step. The consensus was that it was clear the order they needed to go in, but they weren’t about to read every step, too.
When I was originally researching the different sites, I assumed that this site was going to take the cake for being the most popular since it was the most dynamic looking—but I was wrong. While students really liked the photography, there didn’t think there was enough content to tell them where to go—and even after looking at the page, it was hard to tell what to click on next to actually start the orientation.
This site was by far the most popular site presented. They loved how breezy the text was, and that there was a navigation on the left side. One student said that he liked it in case his laptop battery died, or he was interrupted, he could easily get back to where he left off. A lot of students echoed that sentiment in different ways. And again, the clear beginning with the orange button.
So we had some great ideas of where to go with content and design, but we still wanted to bring the site up a notch, and also prepare it for future iterations especially with the way the web has moved in the past five years, we’re doing more harm by not modifying things.
When the old orientation site was created in 2007, there were a lot of perceived constrictions especially around what students should and could be expected to accomplish. 1.1 billion peopleFirst of all, the use of broadband increased, so people can search the web faster, and download pages in a more timely way. So if we did opt to include more interactive content, we’re no longer hampered by accessibility issues. Secondly, all those references to Internet Explorer -70% of users were using IE. Nowadays, that number has been cut in half, and we couldn’t just tell people to switch their browser to access our site—we need to make it accessible across platforms. Which leads me to the 3rd and possibly the most important influence in design: the way that mobile devices have EXPLODED. Numbers might even be a little conservative. But there’s a pretty good chance that people are going to be doing orientation on a mobile device.
To be completely honest, my involvement in the actual design of the site was pretty much limited to Hey! Let’s make it responsive! Responsive, in simple terms, is a holistic way to look at web design that incorporates code that basically modifies content depending on what device the site is viewed—in a sense responsive encompasses more than just design. The credit really belongs to Sue, my former counterpart in Academic Affairs who took it upon herself to learn how to do the coding. She taught herself CSS3 using A Book Apart’s ‘Responsive Web Design’ by Ethan Marcotte.Anyways, the online orientation site was the first responsive design that Sue’s ever done, and she did a bang-up job, and I’ll show you how in just a bit after we talk about content.
Ok, so we convinced them that the site was outdated, wasn’t reflecting or serving students’ needs and needed to be redesigned.The final hurdle came down to the nitty gritty content. We had worked out the content strategy along with the design, and there was no way that we could take the old content and pound it into the new framework. Like a square peg in a round hole, right?
If any of you are into content strategy, you’ve probably heard of Karen McGrane, she’s kind of a big deal when it comes to the field. This quote sums up my focus on the content, even though I know, agility isn’t really a word that is associated a lot with higher education. Up until this point, I had mostly managed the production, but at this point I started working heavily with the content. In our ideal content generation world, our subject matter experts would collaborate on content and sent it to me, and I would collate and review it and fit it into the overall structure of the orientation. But, nothing ever happens smoothly in the real world, right?Most of you probably know that project management means not only knowing your product, but also knowing people as well. But this is where I really started to understand where they were coming from, and why it felt like they had been pushing back this entire time.
Anytime you’re dealing with clients—both internal and external—it’s important to understand the context in which their questions originate, particularly if it’s around something they’re personally, emotionally invested in. With the orientation redesign, we needed to get their support, which meant understanding their emotional investment in the product.Pop quiz. So in this case, when they asked why do we need a new orientation, they’re really saying that In most cases, it was because our subject matter experts were speaking directly from their own point of view. Remember Barney Cam? When the White House put that camera on George W. Bush’s dog, and it was a cute idea, but really a lot knees and just a really narrow, contrived point of view of the White House? You couldn’t make a thorough map of the White House based off of Barney Cam, it takes multiple perspectives to build something. We needed to get them out of the weeds, so to speak, and see the bigger picture, that this needed to be a cohesive, navigable experience, not a collection of pages.I mentioned earlier that we were pretty short staffed on this project, and everyone who came on board accepted mostly out of the goodness of their heart—no one was forced into the group. But it was hard to pull the quality that we needed, which resulted in multiple revisions, and as time wore on, people started to wane a little bit. To motivate them, we could show them the after effects of the initial process, and how every piece of what we were working on was a piece of the larger whole. We didn’t want to devalue the work that had been done previously, or paint it in a negative light so much as needed to move on from it. What we learned was that people had written their own processes into the orientation, and so when we wanted to change things, they took it to mean that we were trying to change them, or their practices. The feedback that we gathered helped negate this feeling, and we were able to create a scalable plan that utilized everyone’s strongest skills. When opposition arose, we called down the greater good, and point to the research and the information gathered between departments to come to a consensus.
In terms of managing the content for the new orientation site, building trust turned out to trump process because it helped all sides involved see the bigger picture, and develop balanced content. The subject matter experts were very focused on what students needed to know—to them, that meant every conceivable acronym to how to register for graduation—and that’s where my part was to pull them back a bit, and refocus them on figuring out how to help them know what classes to register for, and how they could funnel what they need to do with what they need to know.
The main effect of all of this was that our content was consistent and balanced, but there were some second level causations as well, like this idea. The overarching lesson from the experience was that we needed to be careful in how we approached things. When multiple divisions are invested in a project—and you have a few individuals speaking for those divisions—it’s important not to get mired down in the politics, especially when the customer or the student isn’t being served. You really just need to understand what the issues are and how they affect the project, which in turn helps build trust. For this project, building trust lead to building sustainable processes between divisions. To go back to the earlier example of the student who cold called a whole department, we found that by generating content that reflected this kind of trust and cohesion, we reduced redundancy and enhanced clarity, so instead of feeling like they have no information, they have an entire arsenal of organized information to draw upon.
**Move to live browser**Datatada!!!!!! Ok, so, how we applied all of that research into this site. First of all, the orientation site is entirely open—if you want to check it out, go to orientation.metrostate.edu—so there’s no logging in, there’s no access revoked after a period of time, students and staff can come back into orientation at any time to refer to anything. We kept the content relevant and conversational, and tried not to bog down pages too much. To accomplish this but still appease our subject matter experts, we added these “Find Out More” sections, and when we wanted to refer to something in multiple places, we created an interactive PDF that housed that information so we weren’t crosslinking. Sue designed a navigation that kind of doubles as a progress bar which helps keep students on track and also an idea of how much is left to go. We peppered in some pictures to prove that, yes, we ARE a real campus, as well as some quotes and bits of information to keep them engaged. And...the most important piece of feedback: clear next steps at the bottom of each page. And the responsive elements.