Team 9

From Cmsc434_s10
Jump to: navigation, search

An Improved Application for the UMD Surf Club

Team members:

Team9.jpg

Project Proposal: Catching the Wave @ UMD

A web page that will improve the efficiency and aesthetics of the existing UMD Surf website.

Users and tasks

The targeted users are those who are either in the surf club or those interested in the surf club here at the University of Maryland.

Tasks we wish to support through a web application:

  • More organized event presentation (trips, meetings, etc.)
  • Ability for an Admin to update those events
  • Possibility of having real-time wave information
  • Photo gallery
  • Google maps application
  • Forum
  • Log in and registration

Existing solutions and their limitations

  • The current UMD surf website www.studentorg.umd.edu/surf
  • The current UMD surf website is extremely primitive and outdated. The sites source code is also corrupt and disorganized. Therefore, we have to go in and correct and add to the code. We will also be adding additional functionality to the site.

Meeting notes

Ideas we brainstormed included:

  • Website functionality we wish to add
  • Possibility of adding a search engine option
  • The use of flex to alter/update existing code
  • Acquisition of original code
  • Google app engine usage
  • Possible design alterations
  • Log in and registration


Our whiteboard pictures and a flowchart representation of how the application might work.

Whiteboard-team09.jpg

User and Task Analysis

Data Gathering Techniques

  • Interview->We are going to ask a few surf club members several questions pertaining to the functionality of the website.
  • Questionnaires->We would make a list of questions that we would then submit to the surf club's leadership to distribute during their next meeting. Then we would get the questions back and analyze the input from the club members and alter or add functionality of the website based on their wishes.
  • Research Similar Products->Look at other club and membership websites and look at how they keep track of members. We would then see what would work out best for the implementation of the site.

Technique Execution:Interview

Lucas Kelly:

  • Surf Club Vice President
  • Surfer
  • Old editor of the website
  • Friend
  • Existing User

Jack Kleman:

  • Surf Club Member
  • Surfer
  • Friend
  • Existing user

Pat:

  • Surf Club Member

Questions:

Q: Would you use an online forum? A: Yeah, sure.

Q: How often do you go on trips? A: Two planned trips a semester, and sometimes an unplanned trip.

Q: Do you have a lot of pictures you've taken on trips? A: A good amount, probably enough to merit a photo album.

Q: How do you usually organize trips? A: The date of the trip is pre-determined, then an e-mail is sent to the group members of the club, then there is a meeting.

Q:What kinds of features would you like? A:No, Everything that you guys listed seems perfect.

Q:Would live wave data be helpful? A:Yes, from sites such as swellinfo and surfline

Q:Are there any logos/pictures that you'd like on the website? A:Possibly, they will track it down and give it via usb

User Classes

Administrators:

  • Age:20-22
  • Education: College Students
  • Jobs:varies
  • Computer Skill:low-medium
  • Computer Experience: medium
  • Location: Home or residency
  • Motivation: Run the club smoothly and efficiently
  • Attitude: Excited about surfing
  • Usage Pattern: Frequent/Daily

Persona

Josh Stone is a 21 year old senior who is one of the administrator of the UMD Surf club. He visits the website daily to post information regarding new events and meeting info. He wants to post the information as quickly as possible because he usually has other obligations to attend to.

Members:

  • Age:18-22
  • Education: College Students
  • Jobs:varies
  • Computer Skill:low-medium
  • Computer Experience: medium
  • Location: Home or residency
  • Motivation: Participate in surf meetings and trips
  • Attitude: Excited about surfing and hanging out with the members
  • Usage Pattern: Frequent/Occasionally

Persona

Bob is a 19 year old Sophmore at the university and is also a member of the surf club. He visits the website frequently to look at important info such as meeting dates/time as well as events that are happening. Bob also likes to visit the forum to post ideas and also chat with his fellow members.

Potential Members/Guests:

  • Age:18-22
  • Education: College Students
  • Jobs:varies
  • Computer Skill:low-medium
  • Computer Experience: medium
  • Location: Home or residency
  • Motivation: Interested in surfing but not a member yet or interested in becoming a member
  • Attitude: Curiosity
  • Usage Pattern: Infrequently

Persona

Jill is a freshmen at the university and is interested in joining the surf club (because that's what she did at home). She wants to know how to register and log in as well as introducing herself on the forums to her potential fellow members. She also needs to sign the waiver to participate in the events she notices on the main page of the Surf website she visits ocassionaly.

Potential Stakeholders

  • The University of Maryland because they might need to refer to the website to students who are looking at clubs
  • Other Surf Clubs who are interested in setting up competitions (or become extremely jealous by our awesome site that we are gonna design for the UMD Surf Club)


Established Tasks

Administrators

  • Task: Club Administration
  • Goal: Keeping members updated and moderating forums
    • Preconditions (low complexity):
      • Log in as administration handle / be registered as administration handle
      • Must have working knowledge of forum tools
    • Subtasks (Very Frequently):
      • Post/Update events on the main page as well as the forums
      • Send messages out to members notifying them of important events/dates
      • Browsing forums to moderate them
      • Checking forums/emails as well as posts for member feedback and notifications

Members

  • Task: Keeping updated on events and helping administrators
  • Goal: To receive info on events and communicate with other members
    • Preconditions (low complexity):
      • Must be registered user and login as that handle
      • Must have knowledge of forum usage
    • Subtasks (Infrequent to very Frequent depending on the motivation of the user):
      • Check the main page, the forums as well as personal email for notifications
      • Message administrators with feedback on events/news/errors
      • Post new ideas on forums or just get to know other members better

Potential Members/Guests

  • Task: View the site for information
  • Goal: To see if they want to join the club/View general info
    • Preconditions (Very low complexity):
      • User must know how to view forums
      • Must be a student of University of Maryland if they want to join the club
    • Subtasks (Infrequently):
      • Look at main page and forums for info
      • Download the waiver and fill it out if user wants to join the club
      • Get to know members and administrators (as well as notifying administrators on questions like how to join)

Design Sketches

Scenarios

  • A rare and awesome surfing competition is going on next week (HIGHLY MOTIVATED)and Bob needs (NEEDS)to let all the members know the details and date of the event (TASK). He wants to post it up on the forums as well as the main page instead of just the main page because its just that important (INFREQUENTLY). Therefore he needs to create a new event post on the main page as well as the forums (SUBTASK). He goes online and to the surf page (CONTEXT) but needs to log in to the page as his administrator account (PRECONDITION). He types his account handle name as well as the corresponding password and the page refreshes and gives him administration options. He first creates a new event on the main page with the "create event" button and then writes in the details of the surfing event and submits it (FREQUENCY: RARE). Next he goes to the forums and under the "events tab" creates a new thread with the description inside. He submits this thread and then logs back onto the main page. Bob also sends out notifications to all members about viewing the page on the new event (SUBTASK). A few days later, a member emails him that the date of the event on main page and the forums are different and is confused which is the right date (ERROR/SUBTASK). Bob logs back in and changes the incorrect date to the right date and thanks the member for the notification (ERROR Recovery). That same day, Bob views his email and sees a notification that someone has posted something inappropriate on the surfing event thread. He goes and browses the forums (SUBTASK) and then removes the inappropriate material on the thread.
  • Josh has heard the news of the surfing competition from Bob's email, but he has no idea about the details. He needs to check them out (NEEDS) because he is eager to go (HIGHLY MOTIVATED). He goes online and logs in (Precondition). He goes and checks the main page and sees the event (SUBTASK) but he wants to see other members comments on it. So he visits the forum (FREQUENTLY) and goes to the events thread to see the new event post (SUBTASK). He checks out who else is going and what other people have to say about it. He comments on the post by asking how are they going to get there, commute separately (which they require Google map directions) or carpool together (SUBTASK). In addition he notices that the event date on the forum is different from the main page one and notifies Bob (SUBTASK) about it (FREQUENCY: RARE). WOOPS! Josh has said something against forum rules accidentally in his post (ERROR) and then promptly edits it before anyone notices it (ERROR RECOVERY).
  • Jill one day visits the UMD Surf Site (RARELY). She sees there is this new AWESOME surfing event on the main page and it catches her interest slightly (SOMEWHAT MOTIVATED). She is a student at the University of Maryland (PRECONDITION) and now wants to join the club because of that new event. She checks the threads that is open to unregistered users and looks at "how to join" (SUBTASK). She introduces herself on the forums under new members and sends a request to Bob to join the club (SUBTASK). She prints out the waiver and then later turns it in personally to Bob (SUBTASK). She notices she has made a mistake on the waiver because when Bob posts up her information, her address is slightly wrong (ERROR). She notifies Bob to change this (ERROR RECOVERY).

Preliminary Design Sketches

  • Event Posting:
  • Viewing New Event:
  • Accessing Waiver:

Conceptual Storyboard

UI Storyboard

  • Creating a New Event:
  • Posting a New Event:

Paper Prototype

Briefing

Our website is designed to provide information (new and old) to all members as well as provide a forum where they can provide details/feedback on events/news as well as chat with each other. In addition, the website is designed to allow new users to see general information as well as download the content needed to join the club.

Prototype Photos

Risk Assessment

There are several risks within our current prototype, 1 of those is when a member wants to comment on an event on the main page, it does not direct them to the forums so they can provide feedback, instead they must manually go to the forums and find the thread. Another risky part in our interface is when the admin creates a new event, but there are no current options to notify all members.

Scenario Tasks

  • User 1: Administrators
    • Task: Administrators need to post a new event and then write about it on the forums.
      • Precondition: Log in as Admin
      • Subtask 1: Add new event on the main page
      • Subtask 2: Write about the event on the forum
  • User 2: Members
    • Task: Members need to check the main page and view the details of the new event, in addition provide feedback on the forums
      • Precondition: Log in as member
      • Subtask 1: View the details of the new event on the main page
      • Subtask 2: Go to the forums and provide feedback in the correct thread
  • User 3: Interested Individual
    • Task: Download the waiver form so you can apply to join the UMD surf club
      • Precondition: Be interested in joining!
      • Subtask 1: Open up the waiver popup
      • Subtask 2: Fill out and sign the waiver form and submit it to an authorized Administrator

Observations on Testing Day

There was some difficulty finding the waiver button because it is located at the bottom of the page. A larger problem is that the user wanted to click on the event to find more information on it, but the event is not supposed to be click-able. This shows that it would be a good idea to make the front page events click-able, since that is the first thing users will try.

Iteration

We found that our initial design that we tested on testing day proved to be what we wanted to make our website look like. Most of the functionality was very easy to use and easy to learn, as well as keeping the idea of simplicity while not loosing functionality. The only thing that we did change was instead of having a button for a waiver, we included a tab for documents.

Observations on Real Users

We asked two officers of the UMD surf club to use the prototype to perform the same three tasks that were testing during test day. A few things popped up as to the functionality of the website that we are looking to change and implement. The first was to create two different dates for events, the start and the ending date. The second was that the log in functionality was not quite the way they wanted. They wanted to be able to log in as an administrator, or as a member. So we are going to have to create a log in for an admin, then the members. The final thing that they had difficulty with was the fact that our documents tab did not include a lot of other documents that they have for the club. Using these operations, we hope to fix these implementations short-comings.

Risk Resolution

Our biggest risk that we found was the log in. We plan on just having one administrative account that the officers share to edit information on the site. However, it seems that as officers pass, they will still be able to edit information on the site, even though they should not be. In order to counter this, we are going to need to offer a way to change the password to the admin account. Other than that, the security and usage risk of the site is rather low considering that the whole purpose of the site is to output event information and information about the club.

Computer Prototype

Media:Surfmain.swf This is only a temporary placement for the site (undergoing construction)

System Requirements

This website looks best on Firefox using Windows XP at resolution 1440 by 900.

Starting up Instructions

Although I post this link, the website still is not able to be seen. We are working on that now.

http://terpwaveriders.heroku.com/surfmain.html

Fidelity

The login functionality is shallow, so any login will work. The event creation system is deeply implemented. The task of creating a new event is implemented. In the final implementation there will be a admin login system, a photo gallery, and a forum.

Comparisons

Experimental Design

Nate DeSelms

I would like to compare my group's website against the existing UMD surf club website. To create an experiment out of this comparison, I would create the hypothesis that our website design is more visually appealing to college students than the existing UMD surf club website. The independent variable would be whether a subject is viewing the existing surf club website or the website we have created. The dependent variable is the rating of the visual appeal of the viewed website on a 1-10 scale. Three variables that should be controlled are: 1. The experience of the subject with our site or the existing site 2. The technical experience of the subject 3. The computer the subject uses to access the site. The experimental protocol would be for the subject to rate each site from one to ten on how visually appealing the sites are. This test would be "within subject".

Jonathan Lee

Part 1:Design

  1. State a lucid and testable hypothesis
    • It is more efficient to use our planned website than the current UMD website for administration tasks
  2. Identify independent and dependent variables
    • Independent:
      • The user interfaces of each page, internet speed, user reaction time, and user task
    • Dependent:
      • The time it takes for the related material to be present to the user as well as user satisfaction
    • Controls:
      1. Familiarity with navigating websites and forums.
      2. Has an administration handle
      3. Ability with computers.
  3. Design the experimental protocol
    • Task:
      • Create a new event as an administrator
    • How?
      • Within subject.
  4. Choose the user population
    • Who?
      • Administrators of the surfclub website
    • How to sample?
      • Allow current administrators to play with the implemented website and compare it to the old

Part 2: Run Experiments

  1. Apply for human subjects protocol review (IRB)
  2. Run some pilot participants
  3. Modify and finalize the experimental protocol
  4. Run the experiment

Part 3: Analyze Results

  1. Perform statistical analysis
    • Null Hypothesis:
      • The user will find no real significance in speed and satisfaction between the current site and our implementation when
    they do tasks.
    • Alternative Hypothesis:
      • It is easier and faster to create new events with our new website
  2. Draw conclusion
  3. Communicate results

Frank Cannavo

Part 1:Design

  1. State a lucid and testable hypothesis
    • It is easier to post an event on our website than it is on the old website.
  2. Identify independent and dependent variables
    • Independent:
      • The ease of access to pages, the navigation of the pages, the storage of the events
    • Dependent:
      • How long it takes to post a detailed event.
    • Controls:
      1. Familiarity with navigating websites and forums.
      2. Has Admin Permissions
      3. Ability with computers.
  3. Design the experimental protocol
    • Task:
      • Create a new event as an administrator
    • How?
      • Add a predetermined event with the information given.
  4. Choose the user population
    • Who?
      • Leadership of the surfclub
    • How to sample?
      • Allow current administrators to play with the implemented website and compare it to the old

Part 2: Run Experiments

  1. Apply for human subjects protocol review (IRB)
  2. Run some pilot participants
  3. Modify and finalize the experimental protocol
  4. Run the experiment

Part 3: Analyze Results

  1. Perform statistical analysis
    • Null Hypothesis:
      • The users will find it easier to post an event on our website than it will the old.
    • Alternative Hypothesis:
      • It is easier and faster to create new events with our new website
  2. Draw conclusion
  3. Communicate results

James Tarkenton

Part 1: Design

  1. State a lucid and testable hypothesis
    • Our website makes it easier to obtain the information users need.
  2. Identify independent and dependent variables
    • Independent:
      • User interface; i.e., which layout (pre CMSC434 vs our design) is being used.
    • Dependent:
      • User satisfaction and, to a lesser extent, time needed to obtain necessary information. Obviously, repeat trials with the same subjects would be biased, as remembering where things are would reduce the time needed.
    • Controls:
      • User experience
      • Hardware (especially input devices! using a mouse vs. using a trackpad may affect ease of use)
  3. Design the experimental protocol
    • Task:
      • Locate specific information, such as the details of an upcoming trip, the waiver, an officer's contact information, or something else constant across all subjects.
    • How?
      • Go to main page, and navigate until user believes that they have obtained the information.
  4. Choose a user population
    • Who?
      • Surf club members who are not in positions of leadership (officers would likely already know the information!)
    • How to sample?
      • Have the user find information on either the old website or the redesigned website. The user would be timed, and would be asked to rate his or her satisfaction afterward. An independent sample T-test would allow the comparison of old to new, despite the fact that no subject tested both sites.

Part 2: Run Experiments

  1. Apply for human subjects protocol review (IRB)
  2. Run some pilot participants
  3. Modify and finalize the experimental protocol
  4. Run the experiment

Part 3: Analyze Results

  1. Perform statistical analysis
    • Null Hypothesis:
      • There is no significant difference in ease and speed of obtaining information from the new website as opposed to the old one.
    • Alternative Hypothesis:
      • It is easier/faster to obtain necessary information from the new website as opposed to the old one.
  2. Draw conclusion
  3. Communicate results

Implementation

Plan

UI: Must have

  1. Event Section [Jonathan Lee] Implemented by Jon
  2. Event Adding Functionality [Jonathan Lee] Implemented by Jon
  3. Forums [Nathan DeSelms] Implemented by Nate
  4. Contacts Page [Frank Cannavo] N/A
  5. Documents Page [Nathan DeSelms] Implemented by Nate
  6. Admin Login Functionality [Jonathan Lee] Implemented by Jon and Frank

UI: Nice to have

  1. Photo Album
  2. Weather display

Server: Must have

  1. Event Storing [Implemented by Frank and Jon]
  2. Forum Hosting [Implemented by Frank and Nate]
  3. Document Hosting [N/A]

Server: Nice to have

  1. Login info storing [Implemented by Jon and Frank]
  2. Forum Hosting on same hosting location as website [N/A]

User Testing and Analysis