leann larsen final report
TRANSCRIPT
Leann Larsen FINAL REPORT
Team Member
Leann Larsen [email protected]
Cell Phone 801-669-4776
Statement of Problem/Challenge
The Digital Media Department at Utah Valley University is implementing new curriculum
changes for the Fall 2012-2013 catalog year. This new curriculum includes the Portfolio Review
Acceptance program. New undergraduate Utah Valley University Digital Media students will
need to learn and understand the Portfolio Review Acceptance program because they must begin
to create and organize their digital portfolio and obtain B- grades or higher in the lower division
courses they complete. Preparation for the Portfolio Review Acceptance program is important
during the beginning of their educational career so they will have the grades they need as well as
their digital portfolio to apply for the program. We will need to design informative instruction
that is easily available to a large target population in order to teach this process. After they have
completed the instruction, they will know what is expected to get accepted into the program.
Review of Related Products/Systems
The following two examples show two different learning module websites that are similar to my
project. My project has five informational learning modules.
This learning module website has problems. It is located at:
http://www.makingthemodernworld.org.uk/ .
After clicking on the the Learning Modules tab, I put the mouse over the text and it all
becomes underlined in the beginning paragraph. When you click on “more info” for biology, all
of the text is underlined. I’m not sure if it is a link or not? I’m confused about what is going on
and where I need to navigate.
Underlined Text, not sure where to navigate or where I should go? This website appears to be a
textbase model for comprehension and learning. This is a second level of comprehension model.
There is information given about this subject and the site is based on information presented to the
learner. There is very little interactivity. The only interactivity is navigating to another
informational module.
Learning modules for the Google Sites website at
http://edutraining.googleapps.com/Training-Home/module-5-sites
There are some principles of design listed with examples; however, there is a navigation
problem with the examples. Once you go into the example, you cannot return or exit without
shutting down the whole website.
https://sites.google.com/site/teacher25/projekte-proyectos/artistas/gabriele-muenter
This is a critical issue because you have to shut down from the website in order to exit from this
screen. Even though it appears to open a new tab, when you click on the x, the entire website
closes out.
The information on the Google Apps Training Site is presentation based. It falls under the
textbase model of comprehension. This is a second level of comprehension website. There are
no interactive modules offered to help teach this subject. The only interactivity is navigating to
another learning module.
These two learning websites do not have much interaction. I did think they presented good
information that helped me, but only on a second level comprehension or textbase model. They
did not offer a third level of comprehension or situation model.
These examples have helped in designing my project. I decided that I want my project to be
more interactive and address the third level of comprehension called the situation model. I
included a “Tutorial” so the learner can review, analyze, comprehend, and apply the knowledge.
I also included examples and nonexamples of portfolios so the learner can review and apply the
information in compiling their own portfolio. The user can return to it to review as often as
needed.
Summary of Interviews and Participant Profiles
The user interviews that I have conducted have focused on the types of technology that the
students use and what technologies they use to learn new things. Specifically, they use the
internet, Google search, Wikipedia, and YouTube tutorials to learn new things. They use these
technologies on a daily basis. I have included a question about digital portfolios in order to find
out whether or not they have any knowledge about them. The users are somewhat familiar with
digital portfolios but they stated that they would like to see actual examples of good portfolios
and bad portfolios. They believe that digital portfolios are a reflection of your best work to show
an employer during the job interview process.
All users are most concerned about being able to understand the process that is being taught and
that it includes easy navigation. They stated that they do not like tutorials that leave out or skip
important information. I interviewed four prospective students because the design project is
targeted toward new undergraduate college students. I also interviewed three current students in
order to get their perspective on technology after beginning the program. I felt that this would
give me a good basis for designing a project based on a persona.
.
Participant Profiles
Interviewees
Age, Gender, and
Description
Technology Experience
M.T. 31 yrs old, female, current
student. Came from a poor
family, is a 1st generation
college student.
Internet, Ipad, Microsoft
Office 2010, Computers,
Banner System, Facebook,
Messenger, Text, Facetime. I
use technology every day in
my life. I love it and I need it
to function well.
J.P. 29 yrs old, female, current
student. Loves to read, likes to
watch and play sports. Love
ballroom dancing especially
swing dancing. Loves
puzzles.
Internet, Smartphone,
Microsoft Office 2010, Banner
System, Computers PC &
MAC, Facebook, Messenger,
Twitter (social media), Linked
In, Text, Email. I use
technology every day for
everything. I cannot function
without it.
T.B. 24 yrs old, male, current
student. Full time Digital
Media student at UVU.
Internet, Computers PC &
MAC, Adobe Suites,
Facebook, Farmville, Video
Games, Email, Open Office. I
use it every day and I can’t
function without it.
C. F. 17 yrs old, male, prospective
student. High school senior,
graduating in May 2012.
Loves to read, play video
games, listen to music. Loves
theatre, may want to major in
Digital Media with Cinema
Production Emphasis.
Internet, Smartphone,
Computer, Microsoft Office
2010, Video Editing Software,
Programming for computer
JavaScript, DOS, Facebook,
You Tube, Pandora. I use
technology hourly and every
day of my life.
T. B. 56 yrs old, male, prospective
student. Laid off construction
worker with health issues.
Vocational rehab is paying for
a new career. Wants a career
in Internet Tech or Project
Mgt.
Internet, computer, laptop,
Facebook, email. I use
technology every day and I
want to learn more.
J. N. 21 yrs old, male, new student
starting Fall 2012. Majoring
in Digital Media with Cinema
Production emphasis.
Internet, computer, laptop,
Blue Ray, Video Games,
email, text. I use these every
day.
E. P. 33 yr old female, prospective
student. Single mom with two
kids. Wants to get an
education in order to support
herself and her kids. Currently
works part time for a real
estate appraisal company.
Internet, laptop, video games,
DVD & Blue Ray, Microsoft
Office 2010, Facebook,
Smartphone, email, Text,
Messenger, Da Vinci Real
Estate Appraisal software.
Key Design Priorities and Issues
Priorities
New undergraduate Utah Valley University Digital Media students will learn and
understand the Portfolio Review Acceptance process. Information is presented in both
text form and video form under the “Portfolio Review” button. The link to this
informational website is located on the UVU Digital Media Website.
o Register for lower division 1000 and 2000 level digital media courses. Obtain B-
grades or higher in the digital media courses.
o Compile a digital portfolio. This will be digital copies of your work on each
project in your lower division courses. I have included a learning module in my
project design that shows how to create a portfolio. There are also both examples
and nonexamples of portfolios to help them as they compile and organize their
own portfolios.
o Write a letter of intent and turn both the portfolio and letter into the Digital Media
Department for review. This process occurs near the mid-term of the spring
semester of their sophomore year around March 1.
o After acceptance into the program, you will be able to enroll in upper division
3000 and 4000 level courses to obtain a Bachelor of Science degree.
Students will complete the online tutorial which is a review of the program and is located
on the informational website. It is located under the “Tutorial” button. This tutorial is
interactive and includes an evaluation and survey at the end.
Information on how to create portfolios, examples of portfolios, and nonexamples of
portfolios are located under the “Portfolio Examples” button.
Students will review the degree emphasis flowcharts showing the courses they will need
to complete. They will need to decide which emphasis they will pursue. These
flowcharts are located under the “Degree Emphasis” button.
Students will schedule an appointment with a Digital Media Academic Advisor to obtain
help and clarification to plan their education. The academic advisor and contact
information is located under the “Department Advisors” button.
Issues
Students will need to make sure they declare their major and emphasis concentration. If
they don’t declare their major, they will not receive notice of the mandatory orientation
meeting requirement. They will not receive important admissions information that will
be sent to all new undergraduate digital media students.
Students, who do not review the informational website or visit with the academic advisor,
may not obtain accurate information.
Students may not know to go to the website and learn about the process. They may hear
rumors about the process from other students which can lead to inaccurate information.
If students do not get the information about the process, they will not know that they need
to begin their digital media portfolio starting with their first digital media course and
obtain B- grades or higher in all lower division digital media courses.
PERSONA
PRIMARY PERSONA:
Brian is a 25 year old student at Utah Valley University in Orem, Utah. He has decided that he
wants to obtain a Bachelor of Science degree in Digital Media with an emphasis in Internet
Technologies. He has learned that the Digital Media Department has some curriculum changes
taking effect for the 2012-2013 catalog year and he will need to learn about them.
He is concerned that he will not make it into the program if he does not understand the Portfolio
Review Acceptance program. He will attend the mandatory face-to-face orientation meeting and
review the UVU Digital Media informational website in order to learn and understand this new
process. The link to this website is located on the UVU Digital Media website and can be found
easily when reviewing the UVU main website as well as the department website. An important
part of his education is meeting with an advisor to receive help and clarification about the
program. He plans on scheduling an appointment with his advisor and will also discuss digital
portfolios with her. He knows that the digital portfolio will be very important and wants
information about it.
He enjoys reading and learning new things using all the available technology. He owns a
computer, iPhone, and iPad and uses these devices to read and learn about many things. He
enjoys being able to search online for important information and learning opportunities and loves
being connected to the internet. He uses the internet to search Google, Wikipedia, and You Tube
and participates in social media such as Facebook, Twitter, and Email every day. He has used
interactive learning technologies in the past and finds them useful for learning new things. He is
experienced in using technology and takes advantage of various software programs including
Microsoft Office 2010 and Adobe products. He thinks Microsoft PowerPoint presentations offer
a great way to learn new things as long as the presentation is relevant to what he is learning and
only uses key points instead of word-by-word explanations. You Tube provides many online
tutorials to show step-by-step processes in learning new things and he finds that this is also a
great way to learn new things. He likes online tutorials if they are easy to navigate and are clear
in their design. He does not like it when important information is not included in the tutorial and
when he tries to search for information he can’t find it. If a website or tutorial is hard to navigate
and the buttons don’t work, he is frustrated and loses interest.
TASK STATEMENTS
Brian is a 25 year old undergraduate student at Utah Valley University majoring in Digital Media
with an emphasis in Internet Technologies. He has learned that there will be new curriculum
changes taking effect for the 2012-2013 catalog year and wants to learn about them. He is
concerned that he won’t get accepted into the program if he doesn’t understand the new
guidelines. The process is called the Portfolio Review Acceptance program.
Brian will attend the mandatory face-to-face orientation meeting where the presentation will be
given about the program which is currently being scheduled for the first week of the Fall 2012
semester at Utah Valley University. He would like to know about the program before the
orientation meeting so on his computer, which has access to the internet, he goes to the UVU
Digital Media website and clicks on the link “Portfolio Review Acceptance Program”. This
website contains detailed information about the process and is designed to allow learning on a
continuous basis.
Each module is named for a different learning area of the Portfolio Review program. Brian can
click on any one of the buttons to find out different information about the program. He wants to
find out specific information about the digital portfolio because it is an important part of the
process. He understands that the portfolio shows his projects but would like some ideas on how
to organize his work. He sees that one of the buttons is named “Portfolio Examples” so he clicks
on the button. This takes him to the learning module about portfolios. There are examples and
nonexamples of portfolios as well as instructions on how to create and organize a digital
portfolio. After he reviews the information in this module, he understands what is required to
compile and organize a portfolio. He also will know that it is important to make sure there are
enough artifacts, the navigation works properly, and it is easy to read. He likes that he can return
to this module on a continuing basis to review and make sure he is following accurate
information in compiling his own portfolio.
He also wants to discuss the details of the Portfolio Review Acceptance program with his
advisor. In order to find out who his advisor is, he clicks on the button “Department Advisors”.
This module contains his advisor’s name and contact information. The module states that he
should call the administrative assistant to schedule an appointment with his advisor.
INTERNAL TESTING: DESIGN REVISIONS
HCI Mockup/Prototype
The original Prototype was changed due to my Client’s request to make it more interesting for
HCI Persona and target learner characteristics. My clients discussed the target characteristics
with me and wanted something that was more interesting. They felt that the links and layout were
outdated. In John Keller’s ARCS Principles of Motivation model, the important components
are Attention, Relevance, Confidence, and Satisfaction. See the following screen shot of the
original prototype:
1st PROTOTYPE
This is a screen shot of the original prototype of the landing page of my project. The key issues
here are the links. The names of the links for each module are not easy to understand. I do not
think the users will know what they mean. . When discussing this with my clients, they wanted to
see a more modern style. They didn’t like just seeing links, they wanted to see buttons. Also, the
margins needed to be corrected to the standard size to fit most monitors. This was a major
revision due to the HCI techniques of combining the persona, scenario, and tasks.
REVISED VERSION
This revised version of the informational website shows buttons with more understandable
names for each module. The margins have been corrected. My clients were happy with this
revised version of the website. I also felt like I was moving in the right direction with my design
to make this project interesting to college undergraduate students. This is a very basic, low cost
prototype where changes can be easily made.
COGNITIVE WALKTHROUGH
The next HCI technique used to analyze my project was the Cognitive Walkthrough. As I
completed the cognitive walkthrough, I found some serious mistakes. The first was that the
buttons where not the same on each page and there were no “states” for the buttons. The user
would not know where he was because the buttons did not change color or have a drop down box
showing where he was or if he had already visited a page. I found that I had forgotten to name
the title pages so this also added to navigational confusion. These are critical showstopper
issues. The second big issue found was that there was no way to get back to the original page
once the user went to an outside page. The user could click on the back button continuously and
maybe eventually get back. Another big issue was that the links do not look like links. I am not
sure the user would really know that they are links. Maybe if they just start clicking they would
find it but the design should be revised to correct these three big issues. The following screen
shots show these issues:
Prior title page with no states to the buttons. The buttons change on each page instead of staying
consistent on each page. It is hard to know where you are, what page you have visited, and where
to go next.
Title page needs to be changed, not sure where I am. Outside links to “How to create a Digital
Portfolio” and “Mahara.org” do not open in a new window. The user has to click the back arrow
to get out or exit completely out of the website.
These links do not look like links because they are not traditional colors and there is no
explanation to help the user know or understand that they are links. They might find it by
accident but this needs to be corrected.
I think these three issues are critical showstopper issues because the user will easily get lost and
this can cause frustration. I corrected these issues and the site is much more useable and easy to
navigate. Please see the following screen shots showing these revisions:
The states of the buttons were added to include a hover color, site visited color, and active button
that has not been visited yet. The hover color is the light green, the visited color is the solid
green with the name of button in white, and the active button that has not been visited yet is the
white background with the name in green.
This screen shot shows this page opening in a new tab or window so the user can easily exit by
simply closing the tab for this page. This will take them back to the original “Portfolio
Examples” page. This screen shot also shows the title page name change.
This page shows the corrected title page with a favicon on the tab. There is an explanation
stating that each flowchart is a link. I kept the links in these colors because they match the colors
that the advising sheets are in each emphasis. The advising sheets are all the courses required
listed in a word document and given to each student when they visit with their advisor. It is a
summary of the catalog.
HEURISTIC ANALYSIS
The first heuristic is “simple and natural dialog.” The idea behind this design is that different
modules that are located on the Digital Media informational website will help users to learn
about the Portfolio Review Acceptance process. This website has been designed to be simple and
easy to understand. On the landing page, there is a paragraph explaining that the website is
informational and they should begin by clicking on the “Portfolio Review” button. These buttons
each represent a learning module. The titles represent what the user will learn when they click on
that button. The following screen shot showing the main landing page with the buttons and the
arrow is pointing to the Portfolio Review button.
PORTFOLIO REVIEW BUTTON
The second heuristic is “speak the user’s language.” The Portfolio Review overview page
includes a video and a text page. The text page is very simple reading consisting of small
explanations listed in steps. The video uses pictures and a musical background to present the
information. The text and video are both included to give a different representation of the
information. The following screen shots show the Portfolio Review page and the Overview and
Explanation text.
PORTFOLIO REVIEW PAGE
OVERVIEW AND EXPLANATION TEXT
The third heuristic is “minimize user memory load.” The website has been designed to be
simple, short, and to the point. Each page has been designed to explain the different items
represented by the names on the buttons, which are the learning modules. The information is
presented in different ways on each page in order to keep from putting cognitive overload on the
user. The interface is designed to allow the user to review each page and the information
contained there as often as they need to retain the knowledge. The user can review the modules
at their own pace. This is very helpful for the Portfolio Examples module. The user will be able
to review both good examples and bad examples of portfolios. Also, included is information on
how to create a portfolio. This is designed to allow the user to return to the page as often as they
need to review. The following screen shots show the Portfolio Examples page and How to Create
a Digital Portfolio page.
PORTFOLIO EXAMPLES PAGE
HOW TO CREATE A DIGITAL PORTFOLIO PAGE
The fourth heuristic is “be consistent.” The website has the same logo on each page in the site
with a hyperlink that takes the user to the main UVU website. Each picture of the Wolverine
located at the bottom of each page takes the user back to the Home page. Consistency is shown
by the buttons and layout of the navigation which is the same on each page. The buttons use
colors to show if they have been visited. The button has a white background until you click on it,
and then it changes to a dark green background. When the user hovers over a button, it changes
to a light green color. The following screen shots show the Logo which returns to the UVU Main
Website, the Wolverine which returns to Home, and buttons showing the different colors
including the hover color.
UVU LOGO TO MAIN UVU WEBSITE
UVU MAIN WEBSITE
WOLVERINE SHOWING RETURN TO HOME
BUTTON AND HOVER COLORS
The fifth heuristic is “provide feedback.” There is a tutorial located under the “Tutorial”
button. At the end of the tutorial there is an evaluation and survey to receive feedback regarding
the instruction. The user will receive a score at the end of the tutorial to help in determining if
there is a transfer of knowledge. The survey results will help in making any necessary changes to
the design or instruction. The following screen shots show the Tutorial page, the Question page,
the Survey page, and the Quiz results page.
TUTORIAL PAGE
EVALUATION QUESTION
SURVEY
QUIZ RESULTS PAGE
The sixth heuristic is “provide clearly marked exits.” In conducting this analysis, it was found
that the documents on every page needed to open in a new browser. This was added to the
design and corrected. This is a critical showstopper issue.
The x in the upper right hand corner of the website provides easy an easy exit. The back button
is an arrow in the upper left hand corner of the website. This is on every page. Also, each
document opens in a new browser window so the user can easily exit out of the current document
and still remain on the website page. Exiting does not cause any problems to the interface.
OPENS IN NEW BROWSER
The seventh heuristic is “provide shortcuts.” There are not any specific shortcuts but the
website is very simple and easy to exit and return to pages and it is very easy to exit from the
interface at any time. The website is very simple so shortcuts have not really been provided.
DEPARTMENT ADVISORS PAGE
WOLVERINE TRACK
The eighth heuristic is “good error messages.” The only error messages are provided in the
evaluation section of the tutorial. If the users answer a wrong answer they will receive a message
stating their answer was wrong. If the answer is correct, they will receive a message stating their
answer is right. They will receive their quiz results after answering all the questions.
The ninth heuristic is “prevent errors.” The website is simple and is easy to navigate into and
out of it. There are no errors in the interface that have been identified. There were some errors
earlier in the design but these were corrected after the cognitive walkthrough.
In summary, after completing the HCI Mockup Prototype, Cognitive Walkthrough, and Heuristic
Analysis, several critical showstopper issues were found and corrected.
THINK ALOUD PROTOCOL ANALYSIS
User Testing
I tested five people using the think aloud protocol analysis procedure. The design I used for
testing was the revised version of my user interface after the HCI Cognitive Walkthrough and
HCI Heuristic Analysis was completed. This was the third revision of my project.
3rd
Version my User Interface. During the think aloud protocol analysis, I received feedback
that the reading text is really good for some learners. Each user in the think aloud analysis stated
that they preferred the text over the video. After discussing this with my clients, they wanted
both the text and the video so the learners could choose which one they want to review. Taking
the redundancy principle into consideration and my client’s feedback, I decided to put both the
video on the page and the text explaining the program.
Three of the users in the think aloud test stated that they really liked the colors or “states” of the
buttons.
The procedure I used during testing was instructions and practice tasks. The instructions
were the following two practice tasks.
1. You are a new undergraduate UVU college student in the Digital Media
Department. What is the Digital Media Department Portfolio Review Acceptance
program?
2. Who is your Digital Media Academic Advisor and what is their contact
information?
The users completed the steps to find out about the Portfolio Review Acceptance program by
clicking on the “Portfolio Review” button in the user system. This took them through the step-
by-step process of the program by reading text or reviewing a short video with pictures and
music. They also were to find who their academic advisor is and the contact information. One
user also went into the “Tutorial” module and completed the captivate tutorial.
The general characteristics of the participants are adults over 18, somewhat computer
savvy; most of them are teachers so they understand cognitive processes. There was one
nurse who tested my interface. She gave me some good feedback about the words on the
“Department Advisors” page. She stated that the color of the instructions was hard to read and
one of the advisor’s pictures was too small. I also received feedback from another user about
these same items. I changed the wording to a darker color and put a larger size picture on the
page. This was changed because some users may have eyesight problems. Even if they don’t
have eyesight problems, it is frustrating when information is hard to read.
I changed the color of this wording because several of the participants in the think aloud analysis
stated that it was hard to read with this light green color. I also put a different picture of Joyce on
this page because several participants thought it was too hard to see her.
The following is the updated version
UPDATED PAGE WITH TEXT COLOR CHANGE AND NEW PICTURE
Comments by Users in the Think Aloud Analysis:
Test User #1: Weird title on the page, “What is overview”? “I’m not sure of the steps I need to
take for Portfolio Review after reviewing the video so I will go into the text version. Actual
steps listed, I like the list. Video version did not give the steps in the same way. I understand it
now after reading the text.” “I like the text best” on the Portfolio Review page. “Easy to get
back on the tab”
“I need to find out about my advisor so I’m viewing tabs and I click on “Department Advisors”.
Tells me areas of specialties. The color of the font is too light. Light green is hard to see.”
Test User #2: “Click on Portfolio Review and I’m assuming I can find out information about it.
Thought big writing was a link but then I realize the link below is what I should click on.
Choose video or text. “I’m going to choose text”. Steps for getting into the program. User reads
steps.
Now I need to find my advisor so I need to go back. Click on tab to close, now I’m back to page.
There is a link to Department Advisors. I see the advisors and what they specialize in and I can
call for an appointment. I’m going to choose Leann because she advises for what I am interest
in. Email address and phone number to call for an appointment. “Trying to click on the
picture, nothing happens”.
Moderate issues found in HCI Think Aloud Analysis: Picture is too small, writing is too
light, when you click on the picture nothing happens. Users thought the picture would be a link.
Test User #3: “Portfolio Review and Overview & Explanation title is weird wording.
Where is explanation in the video? Portfolio examples is nice to see. “Cool flowchart for
Internet Technologies information on the Degree Emphasis page. Found two different
advisors to call on the Department Advisors tab. My advisor is Joyce Porter because I’m going
to do Internet Technologies. I can email her or call to schedule an appointment”
Test User #4: “Not sure which is a process or a program? Animation is cute, UVU mascot or
something? On the Portfolio Review page, “I’m not sure if the video & text are going to give me
the exact same info, one is just video and one is text? I’m going to look at the text first because I
hate wasting my time on videos. Steps to the program identified in text but I wasn’t sure
when I was on the home page if it was a program or a process but the text makes it clear it
is a program. The text is more straightforward. I’m supposed to find my advisor next. I want
to look at Department Advisors. That seems pretty clear. It’s kind of hard to see her (Joyce)
because she’s far away and it’s (picture) so small. I love when they have pictures because
it’s sometimes really helpful that you know you’re going to the right person. In the office
you can recognize the person. You know the person you are looking for because you’ve seen
her. I think this is super helpful. So basically, these are the advisors. It seems like one of them
would be my advisor but I’m not sure which one because I’m not sure if I’m specializing in
Internet Technologies or Project and Information Management. So, Gaming and Animation,
Digital Motion Picture Production, and Audio. Huh, so I guess it’s just one of these two people
but I’m not sure how you choose between them. Maybe this person, Heather Rubey, does it. I
wonder if I could just email her because I hate calling because I’m always either on the bus or
doing something.
Test User #5: “The text is easier to review and understand. I can see all the steps I need to
do to accomplish the Portfolio Review. I need to find out who my advisor is. I’m clicking on
this picture and nothing is happening. Don’t know if it is a link or if it is just not working.
Light green is kind of hard to read. I don’t know which emphasis I want to do yet. So, maybe
I will call the administrative assistant to see if I can talk to one of them. It’s kind of hard to
read & see this page for old eyes.”
SUMMARY OF TESTING
I found several critical showstopper issues in the HCI Cognitive Walkthrough. These were the
problems with the buttons, they were not consistent, and there were no “states” for the buttons so
the users didn’t know where they were in the site. In the HCI Heuristic Analysis I found a
critical showstopper which was that the outside links did not open in a new browser tab. The
user would have to click on the back arrow many times or click on the x and it would take them
completely out of the site. In the HCI Think Aloud Analysis, I found some moderate issues
because most users thought the wording was too light and the picture was too small of Joyce on
the Department Advisors page. This could be a problem for people with poor eyesight. It is also
frustrating to anyone when the wording is hard to read. The following screen shots show the
prior pages with problems:
Buttons were not consistent and needed “states”. This was found in the HCI COGNITIVE
WALKTHROUGH.
Page did not open in a browser window. This was found in the HCI HEURISTIC ANALYSIS.
Light colored writing and picture is too small. This was found the HCI THINK ALOUD
PROTOCOL ANALYSIS.
The updated revised version can be found at:
http://leannlarsen.com/Capstone/Capstone.html
Recommended/ Revisions from User Testing
I determined in the user testing that a moderate issue that needed a revision was on the
“Department Advisors” page. The users also tried to click on the picture thinking that this was a
link. This page had wording in a light green color and the picture of Joyce was really small.
Several of the users stated that they had a hard time reading these two items. I prioritized these
issues in the following way:
High priority issues are the light wording and small picture of Joyce because people with poor
eyesight would have a hard time reading and seeing these items. I felt these were high priority
issues to change in my design because even people without poor eyesight can get frustrated when
they can’t read the information. I changed the wording to a darker color and put a larger picture
of Joyce on the page.
Current changed version of the Department Advisors page as a result of the user testing.
Several users during the testing stated that they were confused by whether or not the Portfolio
Review Acceptance program was a program or a process. They were confused by the word
“Overview” on the Portfolio Review page.
Moderate priority issues are the confusing wording on the home page and also on the Portfolio
Review page. I changed the wording on the home page to say program instead of process and I
changed the title on the Portfolio Review page. These are considered moderate priority issues
because they are confusing. See the following screenshots showing these changes:
Prior version of wording. Revised and current wording.
Prior version with word process. Revised and current wording.
I believe that the changes I made to my interface as a result of user testing have made the
information on the website easier to understand and have cleared up the issues found as a result
of the testing. It is now clear the Portfolio Review Acceptance program is a program not a
process, and the “Department Advisors” page is easier to read.
Here is my final design with the revisions made from user testing. I added some graphics to help
with navigation and information. Each graphic has a purpose. The Paws take the user to the
UVU Digital Media website, the UVU Logo takes the user to the Main UVU website, and the
Wolverine at the bottom of each page on the site takes the user to the “Home” page. Click on
this link to view the final design:
http://leannlarsen.com/Capstone/Capstone.html
I believe that my final design meets the needs of UVU Digital Media undergraduate college
students by explaining in detail the step-by-step process of the Portfolio Review Acceptance
program. It is very easy to navigate and understand each informational module in the final
design. This final design allows our target learners to review the information needed for the
Portfolio Review program and they can go back and review as often as they would like. Also,
this information can be found on the UVU Digital Media website and several students have
already responded that the information has been received and is important.
One important aspect of having this informational website, is it helps the students know exactly
what is required so they can begin to build their portfolios and obtain the grades they need to get
accepted into the program. They need to start working with their very first DGM class to build
their portfolio and to obtain the required grades. If they don’t start immediately, they will not be
ready for the Portfolio Review. This could cause them to either have to wait another year to get
accepted into the program, or not get accepted at all and have to choose another major.
The Portfolios Example page gives examples and nonexamples of portfolios in order to help the
students as they create their own digital portfolio. In my final design, there is also a link to learn
how to create a portfolio.
The future challenge that may need to be resolved is when will we move the website
information to our cloud? Because we use so many graphics and animations in our department,
the main UVU website cannot support the bandwidth that we need to function with these large
programs. Once we finish negotiating price, we will need to move everything to the new cloud.
Our IT department will help us with this.