INP 190 Final Project

1
INP 190 Final Project

• Karen Dec, Project Manager
• Karen Ford, Editor/Coder
• Robert Scully, Coder
• Chris Visel, Information Architect

2
Presentation Overview

• Phase I Requirements Analysis
• Phase II Conceptual Design
• Phase III Mockups and Prototypes
• Phase IV Production and Testing

3
Phase I Requirements Analysis

• Client Our Wedding
• Objective
• to provide users with personalized tools to
  assist in planning their wedding
• Audience
• Primary couples 18-40 planning a wedding
• Secondary wedding vendors and venues
• Brand, Design, Look and Feel
• Friendly, relaxing, happy/fun, contemporary
  pastel colors

4
Phase I Requirements Analysis

• Success Criteria
• Increase number of visits to the site.
• Provide services that users can access 24/7
• Provide personalized wedding planning tools and
  improve on tools/features found on other wedding
  planning sites.
• Provide interactivity for users to leave
  feedback/remarks about local vendors and venues.
• Provide an area where users can view various
  venues, which also allows vendors to advertise
  their work.

5
Phase I Requirements Analysis

• Project Schedule and Timeline
• http//stu.wccnet.edu/kdec/inp190/hw/inp190_hw2.h
  tml

• Project Milestones
• Initial Project Plan completed May 25
• Competitive Analysis completed June 1
• Personas and Content/Functional Inventory
  completed June 8
• Information Architecture completed June 15
• Wireframes/Mockups completed June 20
• XHTML Site Templates completed June 27
• XHTML Coding completed July 5
• User Testing completed July 11
• Site completed and ready to launch July 18

6
Phase I Requirements Analysis

• Competitive Analysis

7
Phase I Requirements Analysis

• Competitive Analysis

• All three sites had
• Budget Planner
• Guest List Manager
• Wedding Website
• Planning Checklist
• Message Boards
• Wedding Shopping
• Wedding Registry
• Fashion and Beauty Info
• Search for vendors/venues

• Our Wedding.com will have
• Vendor review/rating system
• Search vendors by zip code
• Add/edit your own tasks on the planning checklist
• Email reminders to yourself or others from the
  planning checklist
• Honeymoon registry and Wish List for individual
  registry items
• Flower Finder tool

8
Phase II Conceptual Design

• Personas and Scenarios

Planning a small, budget-conscious
wedding Spends 30-60 minutes on the site
daily Loves the do-it-yourself and
make-it-yourself areas Reads the advice about
saving money Uses the gown search tool and
narrows by price
Heather, age 25, Bride
Stacia, age 32, Bride Age 32, planning a large
wedding with a large budget Spends 30-60 minutes
on the site daily Loves the personalized tools
for budget tracking and guest list
management Frequently uses vendor search tool
and reads other users reviews Very experienced
computer user
Jason, age 29, Groom
Paige, age 33, Wedding Photographer
Has her business listed on the site Reads the
reviews written about her business and her
competition Uses a Mac, cant use Windows
Looks for tips on how/when to send out
invitations, the one task his fiancee has given
him Reads etiquette tips and advice Checks the
registry to see what gifts they have gotten
9
Phase II Conceptual Design

• Content Inventory
• Etiquette Articles
• How-To Articles
• Do-It-Yourself Articles
• How To Save Money Articles
• Toast and Speech Ideas
• Vendor and Venue Information Listings
• Gown Information
• Hairstyle and Beauty Information
• Cake Ideas
• Wedding Shop Inventory Items

10
Phase II Conceptual Design

• Functional Specification

• Vendor/Venue Search
• Vendor/Venue Reviews
• Vendor/Venue Admin Tool
• Search Gowns/Tuxes
• Flower Finder Tool
• Gift Registry/Wish List Tool
• Message Boards/Forums
• Shopping Cart for Wedding Shop

• User Login
• Forgot Password Option
• Quick Site Search
• Budget Tracker Tool
• Planning Checklist Tool with Email Reminders
• Guest List Manager Tool
• Wedding Website Creator Tool
• Personal Notebook Tool
• Site Index

11
Phase II Conceptual Design

• Overall Site Architecture

12
Phase II Conceptual Design

• Technical Specification

• Hosting Plan
• Virtual private server with the ability to scale
  bandwidth and storage to match needs as site
  usage grows
• Strong security firewalls, intruder-protection,
  and anti-virus updates
• Offsite data storage and daily backup of files
• 99.99 uptime guarantee
• 24/7 customer support

• Minimum Acceptable Color Depth 32-bit (256
  colors)
• Target Screen Resolution 800 x 600 (minimum)
• Layout Coding Fixed-width, centered
• Scrolling No horizontal scrolling some
  vertical scrolling
• Operating Systems Supported
• Windows 95, 98, Millenium, XP, NT
• Mac OS 9.x, OS X
• Linux
• Browser(s) Supported
• PC Internet Explorer 6, Firefox 1.0, Opera
  7.54, Mozilla 1.75, and Netscape 7
• Mac Internet Explorer 5.2, Firefox 1.0, Safari
  1.2, Opera 7, Mozilla 1.75, and Netscape 7
• Target Connection Speed
• Minimum acceptable 56k modem
• Average user High-speed DSL or cable modem (up
  to 768k)
• Plug-Ins Macromedia Flash recommended, Adobe
  Acrobat Reader recommended
• Security/Encryption 128-bit SSL for ordering
• Back-End Database MySQL
• Coding Technologies PHP (page templates,
  ordering),JavaScript (rollovers), CSS (font/form
  styling)
• Server Configuration Unix or Linux server
  running Apache, able to process PHP, PHPMyAdmin
  to administer MySQL

13
Phase III Mockups and Prototypes

• Wireframes

14
Phase III Mockups and Prototypes

• Wireframes

15
Phase III Mockups and Prototypes

• Wireframes

16
Phase III Mockups and Prototypes

• Process Flows

17
Phase IV Production and Testing

• Site Production

http//stu.wccnet.edu/rscully/ourwedding/index1.h
tml
18
Phase IV Production and Testing

• Quality Assurance Testing
• Objectives
• Report, document, verify code/design defects
• Assure valid code and working links
• Confirm proper display in all target browsers
• Show that users can navigate and perform tasks
  adequately
• Methods
• Unit testing
• Validation testing
• Compatibility testing
• Regression testing (utilized problem tracker
  spreadsheet)
• Usability testing

19
Phase IV Production and Testing

• User Testing
• Card Sort on Global Nav and Sub Nav with 7 users
• Results
• Spelling out Do It Yourself rather than using
  DIY
• Changed Flower Picker to Flower Finder
• Changed Wedding Cake to Wedding Cake Advice
  and Invitations to Invitation Tips to make it
  clear that these fall under Tips and Advice

20
Phase IV Production and Testing

• User Testing
• Cognitive Task Walkthrough with 4 users (write a
  review)
• Results
• Adding content on the main Vendor/Venue page
  explaining what this section is/does.
• Removing Home from the Vendor/Venue sub-nav
• Adding Home to the top and bottom navigation on
  all pages instead
• Changing leave feedback to write a review
• Adding a write a review link in the
  Vendor/Venue sub-navigation
• Creating a new search page specifically for
  finding the vendor/venue a user wants to review

21
Conclusion

• Most difficult thing
• working as a group under serious time constraints
• Most interesting thing we learned
• how to figure out and document Process Flows
• What we learned about site planning and user
  experience
• best to follow the process in order
• no substitute for testing, even if with just a
  few users!