1. Immersion Fall 2008 Final Presentation
Presented By
Heather Hampton-Barclay
Monu Harnal
Carl Hayes
Rachel Hudson
Jennifer Loach
Cammise McInnis
John Oluyomi
Eric Rose

2. The Process
Analysis
Design
Tools Training
Webshop Development
This semester our instructional design efforts can be categorized into four main areas:
Analysis
Design
Webshop development
Tools training

3. Today’s Agenda
Review data as determined by the needs and performance analysis
Explain design decisions and discuss rationale
Introduce prototype, wire frames, and visual designs
Present first draft webshop tutorials on Audacity and Camtasia
Discuss goals for next semester

4. Performance Analysis

5. Performance Analysis
Problem: T/TAC Online is in need of modern and robust online training materials.
Proposed solution: Introduce new tools, create model webshops, make site more appealing.
Data Gathered through interviews with Dr. Mike Behrmann, Mrs. Clare Talbert, and Mrs. Mary Wilds

6. Needs Analysis

7. Current Technology Levels (Tools)

8. In Terms of Support Preferences Assistance from an experienced user
A formal training workshop
Things to Consider
How to Guide
Online Help Menu
Video Tutorial

9. In Terms of Delivery Preferences: Simulations and demonstrations
Video/ Self-running PowerPoint Presentations
Audio
Assessments

10. Needs Analysis Findings

11. Recommended Design Direction
Recommend tools and provide support that meets the staff's needs effectively and efficiently
Make the process of creating Webshops more efficient by updating the template interface
Design an “ideal Webshop” that demonstrates what good interactive training looks like and how to develop it using our recommendations and designs
Research and develop a system of interaction between T/TAC staff collaborating on projects

12. First Persona-Previous Author
Name: Carol Hesse
Age: 49
Job Title: Autism/Alternate Assessment Coordinator
Length of time in position: 21 yrs
Education: Masters Degree in Special Education

13. Carol Hesse Familiar with MS Word and PowerPoint
Like the current template system but feel limited
Would like to see auto save
Would like automatic HTML formatting options
Would like collaboration
Video
Narration

14. Second Persona-Potential Author
Name: Nellie Newman
Age: 37
Job Title: Instructional Consultation Team Specialist
Length of time in position: 3 months
Education: Masters Degree in Special Education

15. Nellie Newman Not Tech Savvy Want support Would like feedback
Would like to be able to collaborate
Want the goals and objectives clearly displayed
Based on the information we collected in the Needs Analysis, we created persona number two. Nellie Newman, our second persona, was created by combining surveyed data we collected from T/TAC Staff who have never completed or created a Webshop, educators, and the parent of a special needs child. Through our research, we learned that these potential users are not very tech-savvy. The people we surveyed are interested in receiving support through “cheat sheets”, online help, and/or hints. Most of those surveyed were interested in some sort of feedback and collaboration: chats, access, etc., especially amongst the learner and the facilitator. They also indicated the importance of displaying the goals and objectives of the training for the benefit of the learner.

16. Strategy Documentation
Concept Map
Competitive Analysis
Content Inventory

17. We began with the Concept Map to illustrate what features we wish to see on T/TAC online based on the collective information that became our two personas. The map indicates how the user navigates the T/TAC site and interacts with each feature.

19. Competitive Analysis T/TAC Online Training competitive analysis
Various competitive advantages
Tools and Support
Website Interface
Ideal Webshops and E-learning
Social Networking
Design solution and direction based on Needs Analysis
Our Usability Team assessed the competitive landscape of websites design with a view to bridging the gaps enunciated in both our Performance Analysis and Needs Analysis.
TTAC Online Competitor analysis identifies the strengths and weaknesses of competing websites before starting work on our prototype. Our tour of four to ten competing websites shows how typical tasks are achieved. We presented and discussed the different competitive advantages inherent in the websites we assessed. Among which are Tools/Support, Interface, Ideal webshops/e-learning, social networking. These competitive advantages are in consonance with our overall goal and design direction, which then parleyed into what fits well with the culture of TTAC organization. Ultimately the Immersion Team will pursue the following design solutions/direction as indicated in our Needs Analysis.

21. Content Inventory “How to use” software to create Webshops
Template Enhancements
Support/Help in Online Training Tab
Online Training Page
E-Learning (best practices to create Webshops)
Social Networking (Internal for T/TAC Staff)
Headings
content
content details
example URL

22. Content Inventory
A content inventory is a structured database of content resources containing information that will be analyzed to inform decisions made about the management of content within an organizational website. The 2008/2009 Immersion Team in our efforts at achieving the over-arching goal of having a clear understanding of the major chunks of TTAC Online, surveyed other similar websites with a view to identifying the missing elements on TTAC Online. This content inventory helped us in our design direction as it relates to TTAC Online website and provided specific information required to satisfy the clearly stated analytical objectives of our project. This well executed content inventory, and analysis based on the information it contains, gave us a good pointer to our ultimate design direction.

23. Design Documentation

24. Design Documentation Visual Design Site Map Use Cases Flow Charting
Wire
Framing
Some key features about T/TAC Online that we (heard our client express) identified during the earlier phases were:
make Webshops more dynamic and incorporate the best practices of e-learning
Create templates that are more intuitive so that staff are enticed to create online training
We also identified that “new” staff:
Would embrace a collaborative, social environment.
With these ideas (and the data we collected during the performance analysis, needs analysis, and strategy documentation) in mind, we began to “develop” and “design”.
The design documentation includes: the site map, use cases, flowcharting, Wire Framing, Visual Design.

25. Site Map
KEY
The Site Map expands on the features illustrated earlier in the concept map (during the strategy documentation).
As you can see here the “NEW” features are illustrated by the blue circles, and the “existing” features are in orange.
As we thought of ways to entice staff to create webshops, we realized a new “STAFF PAGE” linking to collaboration, support for software & resources, and creating webshops/workshops might help to increase motivation.
Now Monu is going to speak about Use-Cases and the Flowcharting Process.

26. Site Map New Pages – Staff Login View
Staff Page
My Online Training
Webshops
Workshops
Support
Software
Resources
Collaboration
Adobe Connect
Discussion Forum
Staff Library
Online Database
File Sharing
While developing the site, the immersion team identified these new pages to be added to T/TAC Online. As you can see here, we are suggesting that when staff login their view should include a new tab titled “Staff Page.”
As we thought of ways to entice staff to create webshops, we realized this new “STAFF PAGE” should include:
A link to “My Online Training” – the personal avenue for staff to view and add webshops
A link to Support for software and resources
A link to Collaboration – to incorporate a discussion forum and link to Adobe Connect
A link to a Staff Library – an online database to house files that staff would like to share
We believe that by adding these pages to the staff view will fulfill the needs of our client. These features include an intuitive design for creating online training and embrace a collaborative, social environment within T/TAC staff.
Now Monu is going to speak further about Use-Cases and the Flowcharting Process.

27. Usage Driven Design Define successful websites?
User interface/experience
Ease of use
Ease of navigation
What drives design
User/target audience
Create standards for Development
While in the Design Phase we were introduced to Usage Centered Design modeling – a technique developed by Larry Constantine and Lucy Lockwood.
This Process focuses on the users experience.
So while designing the Staff Page we had to examine a few aspects about the purpose of the page especially examine what makes a successful website?:
1. How will the user experience the site to accomplish their task?
2. What is the level of ease to use the site?
3. How can the process be more efficient?
4. And if we do make changes to the existing site, how will this effect the user?
5… and what behaviors might the user need to change or incorporate?
Websites have evolved and so has designing/developing them.
Designers and developers are realizing that a successful website takes the user and the usage of the site into consideration.

28. User vs. Usage Driven Design
User Driven:
Limited to what user wants and not to needs
Usage Driven:
Roles users play in relation to the system
Structure of the work users need to accomplish within the system
Organization of the content and how it supports the user interface
Usage Driven Design is:
- flexible approach to designing effective websites
It considerations: roles, structure and organization
Emphasis is with the actual process and navigation within the site
So our process involved ABSTRACT MODELING using colored post it notes, a lot of wall space and keen organizational skills.
Allowed us to walk in the users shoes to accomplish tasks that were identified to us during the Needs Analysis
The Usage Driven Design modeling is further refined into the next process of FLOW CHARTING.
Please remember this is an iterative process

29. Collaboration

30. Gather Information

31. Support

32. The proposed Staff Page includes:
Flow Charting
The proposed Staff Page includes:
Create a New Webshop
My Online Training
View My Online Training
Support
Collaboration
Staff Library
Personal Profile
What is Flow Charting?
Visual process usually
Centered around a specific task or function.
Different shaped boxes
Arrows and signs show the many steps in a process.
These shapes represent actions needed to accomplish a tasks
In the design phase we:
Created a site map
Incorporated an abstract modeling technique
Refined the model by flowcharting each process
The next phase of design is wire framing that Eric will explain further

33. Wireframes

34. What are Wireframes? +

40. Visual Design

42. Tutorial Prototype
Audacity
Camtasia

44. Goals for Next Semester

45. Goals for Next Semester
Flesh out other pages such as Collaboration, View My Online Training, Personal Profile, and Staff Library
Develop in-depth support tutorials for Camtasia, Audacity, and Captivate
Conduct user testing and formally evaluate our prototype