Below the fold: Architecting a mission-critical department website

6,296 views

Published on

A case study about making a departmental website better through user research, information architecture, content strategy, design and teamwork at Ithaca College. Presentation given at eduWEB11, 8/2/11, San Antonio, TX

0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
6,296
On SlideShare
0
From Embeds
0
Number of Embeds
98
Actions
Shares
0
Downloads
21
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide
  • Adam
  • Some of you may be looking for
  • If you’re interested in any of these things, you’re in the right place
  • And not just the fact that some of them were missing their heads
  • Handoff to Todd
  • This is MISSION-CRITICAL
  • Talk about trickle-down redesign. How departments get left to fend for themselves.
  • The result of that is pages like this
  • It was obvious to everyone that this site needed a little work.
  • So here’s what we set out to do. This was our process.
  • All of these people will able to work together by using great tools.
  • Handoff to Adam
  • In addition we looked at letters, billing statements, brochures,phone tree messaging,call logs
  • That presentation provided the outline for a major part of the IA
  • Looking for any and all references to the site.
  • One office, two websites. Nobody knows the name. Can’t find them. Catalog content. Print letters.
  • Last slide in discovery, next is architecture
  • Handoff to Todd
  • That presentation provided the outline for a major part of the IA
  • Notice the numbering system?
  • This looks straightforward… but serious CMS constraints made planning very impt
  • Content requirements tables- one of these for every page of the new IANote the consolidation of deadlines
  • With all of the requirements, we could map out who does what, source content, SMEsNote it’s all still tied to the numbering systemThis is the last slide. Moving on to content design.
  • Handoff to AdamWe call this content design, because the emphasis is on the content, design is used to support that.
  • Then we wireframed every page of the IA, based on content requirements, before the contentThis was important because the CMS situation dictated the placement and layouts of some content
  • Next we produced the content, delivered in wireframes. This was important to emphasize formattingDynamic content (FAQs, Deadlines, promos, documents) delivered in Word
  • Sketches for financial aid 101This was going to be a series of videos, Larry left
  • Slideshow graphics and addl graphics for the site
  • We took inspiration from utility and credit card companies
  • Benjamin and his team at Ithaca did all of the implementation in the CMSBonny populated the content
  • Handoff to ToddNo major issues in usability testsReduced phone calls- staff able to use site as a resourceEasier maintenanceGreat feedback on tutorials– mentions from parents that it influenced their decision
  • Below the fold: Architecting a mission-critical department website

    1. 1. Below the fold<br />Architecting a mission-critical department website<br />J. Todd Bennett (@jtoddb) & Adam Forrand (@4and)<br />decimal152<br />
    2. 2. Architecting a helpful (yes, helpful) Student Financial Services experience<br />
    3. 3. A case study about making a departmental website better through user research, information architecture, content strategy, design and teamwork <br />…at Ithaca College<br />
    4. 4. Ithaca College is a private college located on the South Hill of Ithaca, New York<br />Founded in 1892<br />Just over 6,000 students (mostly undergraduate) with 5 schools and 2 divisions<br />
    5. 5. This is Bonny<br />She is not your presenter, but wanted to be.<br />Say hello to her on Twitter @bggriffith<br />
    6. 6. The right mix of people<br />Benjamin Costello<br />Web Applications Architect<br />Eric Maguire<br />VP for Enrollment Management<br />Various Leaders<br />Student Financial Services<br />Bonny Georgia Griffith<br />Director of Recruitment Marketing<br />and us…<br />
    7. 7. These people had a problem<br />
    8. 8. Like most private colleges, IC is tuition-driven<br />Ithaca’s total cost of attendance is $48,707<br />AND…<br />They award $145 million in aid each year and<br />85% of students receive some financial aid<br />
    9. 9. They have very helpful people in their financial aid and billing office…<br />…but a not-so-helpful website<br />
    10. 10. The background…<br />Financial Aid and Bursar merged <br />Each had separate sites, with different CMSs<br />Tons of redundancies in content<br />Content repurposed from print<br />Sites were a maintenance nightmare<br />Bad user experience for everyone<br />
    11. 11. But they wanted to…<br /><ul><li>Make financial aid and billing easy to understand and the site easy to use
    12. 12. Minimize maintenance headaches for the staff
    13. 13. Develop a model for collaboration on future sites</li></li></ul><li>Why bother?<br />Financial aid is a challenge nationwide<br /><ul><li> Increased reluctance by families to take on debt and borrow money for college
    14. 14. Financial aid is very complex and difficult to understand
    15. 15. Families are in search of better tools to understand the process</li></ul>Study: “Cracking the Student Aid Code”, College Board<br />
    16. 16. FlickrJeremyBrooks<br />
    17. 17. This was ONE page <br />1/8 of that page<br />(Enlarged for your viewing enjoyment)<br />
    18. 18. College Aid Programs<br />Endowed scholarships<br />Federal Programs<br />NY State Programs<br />FAQs<br />
    19. 19. Flickr: Brandon Doran<br />
    20. 20.
    21. 21.
    22. 22.
    23. 23. Discovery<br />Flickr: David G Crawford <br />
    24. 24. Lots of meetings<br /><ul><li>Front-line Financial Aid staff interviews
    25. 25. Admissions staff interviews
    26. 26. Conversations regarding content development and editorial workflows with key SFS staff
    27. 27. A session regarding CMS capabilities, strategies and possible implementation tactics</li></li></ul><li><ul><li> A focus group with current students
    28. 28. Usability tests of the current Student Financial Services sites performed by current undergraduates
    29. 29. A focus group with prospective students and their family members regarding concerns about valuing and financing a college education
    30. 30. Interviews with prospective students and parents discussing their needs and preferences for financial information from colleges and its impact on enrollment decisions
    31. 31. Jargon flash cards</li></li></ul><li>
    32. 32.
    33. 33. Also looked at <br /><ul><li>Entire .edusite
    34. 34. Directories
    35. 35. Index
    36. 36. Search
    37. 37. Letters
    38. 38. Publications
    39. 39. Telephone </li></ul>24 references to “Bursar”<br />
    40. 40. Student Financial Services?<br />“I usually call the bursar’s office and have them transfer me to financial aid”<br />
    41. 41. 2 content management systems…<br /> … each with benefits and limitations<br />Required a hybrid solution<br />
    42. 42. Architecture & Content Strategy<br />Mark Bennett<br />
    43. 43.
    44. 44.
    45. 45.
    46. 46.
    47. 47.
    48. 48. Content Design<br />
    49. 49.
    50. 50.
    51. 51.
    52. 52.
    53. 53. Then we added the REAL content<br />
    54. 54. Content Workflow<br />Working_Copy_ICContent_1.2.2.1_Ithaca_Grants<br />Revision1_ICContent_<br />Revision2_ICContent_<br />FINAL_ICContent_<br />
    55. 55.
    56. 56.
    57. 57.
    58. 58.
    59. 59.
    60. 60. Putting it together<br />Flickr: Comunidade 0937<br />
    61. 61.
    62. 62.
    63. 63.
    64. 64.
    65. 65. Post Launch Testing & Feedback<br />
    66. 66.
    67. 67. J. Todd Bennett<br />todd@decimal152.com<br />http://www.linkedin.com/in/jtoddbennett<br />@jtoddb on Twitter<br />Adam P. Forrand<br />adam@decimal152.com<br />http://www.linkedin.com/in/adamforrand<br />@4and on Twitter<br />

    ×