1. The Lion Lounge
Creation of an Online Campus for World
Campus Students
Liam Jackson and Kim Tweedy
Penn State World Campus

2. In the Beginning…
http://topfreeimages.blogspot.com/2011/11/stonehenge.html

3. In the Beginning…
• Idea for project started 8
years ago
• Original Vision: “E-student
Union”
• Students would be able to:
– Check bill
– Find their academic
adviser
– Get personalized
updates
Photo credit: Penn State Live

4. In the Beginning…
• University was launching portal page for
traditional-aged students
• World Campus students had to add a
World Campus tab
• Static, not customizable

5. In the Beginning…
• Marketing was beginning to discuss
redesigning the World Campus website…

6. The Challenge
• Branding and Design
– Lacked relevant imagery and video content
• Content and Site Architecture
– Site architecture and content grew organically
– Lacked consistency
– Prospective student and current student content
intermixed
– Website was not mobile-friendly

7. Market Research
Research Findings
•Penn State World Campus website was viewed as:
– “Boring”
– Crowded; too much going on
– Not as credible
– Distracting with too many links and tabs
http://knowyourmeme.com/memes/sad-panda

8. Market Research
http://knowyourmeme.com/memes/sad-panda

9. The Lion Lounge
The Process: 2+ Years
Phase Start Date
3.Project scope July 2009
4.Content and design March 2010
5.Market research May 2010
6.Usability testing May 2010
7.Launch and measure results July 2011
8.Usability testing, post-launch May 2012

10. Who was involved?
http://athomewithgrowingold.com/it-takes-a-village

11. Who was involved?
• Outreach Marketing
– Brand Strategy, Web Strategy, Creative
Services
• Advising and Learner Success
– Student Engagement, HelpDesk, Academic
Advising, Academic Support, Career
Counseling

12. Project Scope
Define the objective:
To optimize retention, we will completely overhaul the
website and create a new interface that allows our users
to easily find the information they need, when and where
they need it, online and/or mobile, with clear calls to
action.
• Prospective students
• Current students

13. Who are our current students?

14. Who are our current students?
– ~12,000 students during 2011–12
– Median age: 30
– 52% female; 48% male
– 38% live in Pennsylvania
– Many have never visited Penn State
campus
– Adult learners: time is precious

15. Content and Design
• Overall look and feel
– Simply innovative
– Modern, not trendy: contemporary feel
without the fluff

16. Content and Design
• Photography
– Proud and professional, collegiate feel

17. Content and Design
• Colors
– Penn State blue, warm and modern
• Dynamic Content
– Keep them interested, keep them coming
back
• Consistency with Flexibility
– Consistent layouts, tons of options

18. Content and Design
• Typography
– Clean, simple and easy on the eyes
• Navigation
– I know where I am, and where I can go

19. Usability Testing
• Large usability test
– Previous website
• Many smaller usability tests
– Site wireframes and mockups: “click” testing
• Repeat large usability test
– New website

20. Site Wireframes and Mockups
QUICK AND DIRTY TESTING
• GOAL: get a sense for whether specific design, layout,
and/or navigation elements/labels are working
• APPROACH: find out what’s not working, take our best
guess at fixing, repeat until we think we’ve fixed it, look
out for new problems, repeat repeat repeat.
• Participants were: current students, “friends and family”

24. Usability Test 1: Header Area
Version 1: Full horizontal image with Version 2: Three quarter image with
alerts and tasks stacked under new alerts and tasks in right hand column.
and military student entry points.

25. Usability Test 1: Header Area
Users of Version 1 nearly always completed
tasks twice as fast as users of Version 2.

26. Usability Test 2:
Left vs. Right Navigation

27. Usability Test 2:
Left vs. Right Navigation
Users of right hand navigation completed
tasks roughly twice as fast as left hand nav.

29. After:
Current Students

30. Before:
Current Students

31. After:
Current Students

33. Why Don’t We Ask Them? Current
Students and the Section Name

34. The Lion Lounge Goals
• Advising & Learner Success goal:
student success
• Retention: Allow students to find
pertinent information in
quick/convenient manner
• Community Building: Feel connected
to Penn State

35. How Did We Pursue Goals?
• Design of site (courtesy of our wonderful
marketing team)
• “My Backpack”
• Organization of content
• Graduate/undergraduate split
• Engaging frontline staff bios
• Integration of community-building initiatives
• Support resources easily findable
• Mobile-friendly site

36. Design of Site
• Color scheme based on design of
main World Campus site
• Expandable menus for ease of
navigation (fewer page loads required,
hopefully)

40. Homepage Design
• Banner-style image across top
• Prominent backpack
• New Student Orientation link “front and
center” (actually off to the right)
• Space for alerts - box disappears when not
in use
• Feeds from student blog and social media
• Penn State time

46. Backpack
• Group of 7 helpful/necessary links
• “Carry it around with you”
• Found on every page of Lion Lounge

47. Backpack
• Widely used: 85-90% of traffic to
homepage leaves selects backpack
links
• Top links clicked:
– My courses (50-60% select this)
– WebMail (15-25%)
– eLion (10-15%)

49. Support Resources Findable
• Prominent links for academic advising,
career counseling, technical support,
military/veterans services
• Usability Tests – Where to Find
Advising?
• Time to complete task fell by 61% on
new site design (32 s. to complete
now)

51. How Info is Organized
• Other prominent menu items:
– Course Catalog
– “Your Courses: How-to Guide”
– “Paying for Your Education”

53. Graduate/Undergraduate Split
• Find pertinent information quicker
• When first enter site, choose between
two options

55. Graduate/Undergraduate Split
• Radio buttons to toggle between two
subsets of site

57. Staff Bios
• Full-length photos show staff
personality
• Allow students to “meet” staff on
website

58. v

61. Community Building
• Community section highlights ways to
connect with others (social media,
organizations, etc.)
• Campus shots - banner images
• Feeds from social media/blog on
homepage

63. Mobile-Friendly Site
• Based on undergraduate academic
planner sent to students
• Text-only
• Includes bottom links for contact and
calendar (custom Google Calendar
with academic calendar and fun
historical dates)

65. Moving Forward
• Still looking to create that “E-student
Union”
• Will eventually pull in info from student
information system, after login to site,
creating personalized experience on
site

66. Continued Usability Tests
• Coordinated by Outreach marketing
team
• What are we testing?
Ability to Find Task completion time - New Site
compare to old
Advising info 32 seconds (-61%)
Course info 1 min, 8 seconds (-55%)
Proctor information 54 seconds (-42%)
Drop course info 44 seconds (-41%)

67. Continued Usability Tests
• New tasks: New Student Orientation
links
• Disability services links

68. New Features Coming
• Better Grad/Undergrad split solution
• Custom-designed podcast player
• Degree audit interpretations for
undergraduate programs
• New Student Orientation

69. New Student Orientation Video

70. THANKS!
Liam Jackson
lnj104@psu.edu
Kim Tweedy
kxm78@psu.edu
@tweedys_tweets