Nov 01, 2014
Website Planning & Strategy
Jen Kramer, 4Web, Inc.Cory Webb, Cory Webb Media
Joomla!Day AustinSeptember 15, 2011
•Introduce Jesse James Garrett and the Five Planes of User Experience
•Strategy, Scope, Structure, Skeleton, Surface
•Introduce Minis & Friends
•Get Jesse and the Minis together and see what happens!
Agenda
“I need a site and I want it blue. How
much will that cost?”“I need a house, and I’d like blue paint and
beige carpet. How much will that cost?”
•What do you need?
•How many pages?
•What is your budget?
•Timeline?
•Do you want to edit your own site?
•What features do you want to include?
•Do you want fries with that?
What are your next questions?
Ever forget to ask something?
Oops. Now you’re in trouble.
Especially if you bid a fixed-rate contract.
What questions should I be asking?And does Joomla really make this process
different?
•The basic questions are always the same and in the same order.
•You can make the questions more specific or more general as needed.
•Follow the plan and your site will turn out great with less bumps.
Nope.
•Developed by Jesse James Garrett, www.jjg.net
The Elements of User Experience
Everyone wants to start with making it
pretty.That’s planning your interior decorating without
developing the floor plans first.
What’s more, some clients might feel like you’re wasting their
time.You’re not. You’re actually saving them time and a bundle
of money. But that’s often hard to understand.
•Visit and interact with people of all ages who may be suffering mentally, physically or emotionally.
•Children with disabilities
•At-risk youth
•Individuals in transition
•Elder adults
Introducing Minis & Friends!
•Benefits to participants:
•Improve their motor skills
•Ability to connect
•Tactile response
•Use of senses and spirits
•Benefits to volunteers: “life-changing” experience
Introducing Minis & Friends!
Questions:
•What do we want to get out of the site?
•Who are our users?
•What do our users want?
•What experience are we trying to provide?
•How will we measure success?
Strategy Plan
•More people coming to the site through search engines
•Better search placement
•Easy updates for the website
•Inform community about the service
•Get new members and affiliates
What do we want to get out of the site?
•Coordinators from groups servicing challenged individuals
•Prospective mini horse owners who want to become members
•Prospective donors
•Prospective affiliates
Who are our users?
•Get in touch with Minis & Friends to coordinate a visit to their group
•How to donate
•How to volunteer
What do our users want?
•Warm
•Caring
•Inviting
•“I can make a difference”
•“Gosh, that would be good for me too!”
What experience are we trying to
provide?
•The site should be easily updated by Minis & Friends.
•The site should score better in search engines than it currently does for keywords:
•Mini horses Austin
•Miniature horses
How will we measure success?
•Questions so far?
Strategy Plane
Questions:
•What features will the site need to include?
•What kind of detail will those features have?
•What tools, skills and personnel will we need to build the site?
•What is the timeline for building the site?
Scope Plane
•Contact form/scheduling application
•Easy method of displaying minis/bios (Meet the Minis page)
•Calendar/event feed
What features will the site need to
include?
•It Depends.
•You’ll need to evaluate them on:
•Desired features from client
•Joomla version
•Pre-alpha/alpha/beta/full version?
•Subscription? Support? Upgrade path?
Which Joomla extensions are right
for the job?
•Alex and Jeremy will discuss these in their talk.
Which Joomla extensions are right
for the job?
• Do I need some help?
•Graphic designer to create a custom design vs. canned template
•Joomla extension vs. custom engineered extension
•Client-provided content, or am I writing the content, or do I need a pro?
•SEO assistance?
•HTML/CSS assistance? Custom template construction?
•Something else?
What tools, skills and personnel will we need to build the site?
• Do I need some help?
•Graphic designers: Andy Miller, Kyle Ledbetter
•Joomla extensions: Alex Andreae, Jeremy Wilken
•Site deployment: Brian Edgerton, Joe LeBlanc
•Client-provided content
What tools, skills and personnel will we need to build the site?
•Today.
•Actually, like a cooking show, the site was built in advance, starting in early August.
What is the timeline for
building the site?
•Questions?
Scope plane
Questions:
• How should the content be organized?
• What are the navigation button names?
Structure Plane
•In Joomla, there are two considerations:
•What does the site map look like?
•How are categories organized?
How should the content be organized?
•Think of this as an org chart.
•This is the hierarchy of your pages in your website.
•It can be displayed as an org chart, or as a bulleted list.
What is a site map?
Home
About
Location & Directions
Photos
Physician Directory
Physician Profiles
Testimonials
Primary Care
Surgery
Area Resources
Cultural Attractions
Schools
Recreation
Real Estate
Newspapers
Links
C of C
Visitors Bureau
FAQ Career Opportunities
What is a site map?
• Home
• FAQ
• About
• Location & Directions
• Photos
• Area Resources
• Recreation
• Links
• Chamber of Commerce
• Visitor’s Bureau
What is a site map?
•Card sorting
How to develop a site map?
•See site, www.minisandfriends.com
The Site Map
•Everyone has their own theory and philosophy.
Categories in Joomla
Positives
• Set all articles to “uncategorized” – no thought required
• Client doesn’t need to worry about assigning correct category
Negatives
• Can the client find an article to edit in the article manager?
• Can’t use category blogs/lists or other features
“Categories Don’t Matter”
Positives
•Easier to find content in the manager
•Savvy clients find categories more intuitive
Negatives• Client may get confused
with too many categories• Potentially too much
slicing and dicing
“Categories Follow the Site Map”
•Organize them so you can find what you need, and so can your client.
•Thoughtfully make use of category blogs, and other category-based organization.
Categories Work for Your Content
•Log into back end and show
Our Categories
•Any Questions?
Structure Plane
Questions
•How should forms and other interactive screens look?
•Where should important information be located?
Skeleton Plane
Questions:
•What will the finished product look like?
•What colors, fonts, and logo will we use?
•Sanity checks on layout, user understanding of the site, etc.
Surface Plane
•Complete site map, outlining category structure
•Identification of the types of additional modules/components used on the website
•Identification of a custom component required for the site
•Design brief for designers, based on goals
Our Deliverables
Questions?
Joomla Template Design
Andy Miller, Rocket ThemeKyle Ledbetter, eBayJoomla!Day Austin
September 15, 2011
Preferred Tools
Kyle: MacRabbit Espresso, Firebug for Firefox, Chrome
Web Developer
Andy: Fireworks, Sublime Text, Chrome Web Developer
Why Adobe Fireworks?
- Vector + Bitmap- More Powerful
Compression- Web Slices & Layers
- Much Faster Than Ps or Ai- Smaller Learning Curve
Kyle’s Design Process
Get Inspired!- cssgallery.com
- line25.com- cssimpress.com
- smashingmagazine.com- vandelaydesign.com- bestwebgallery.com- designshack.co.uk
- webdesignledger.com
Grid System - Design Templates- 1 to 1 Pixel Width- Standard Layouts- Rapid Deployment
Andy’s Design Process
Andy MillerCEO / Founder RocketThemehttp://www.rockettheme.com
Logo Design
Design Concept
Andy’s Design Process
Initial Design Concept
Colors and FontsKuler for Colors
GoogleWeb Fonts
Flesh out Design
Finished Comp
HomepageHomepage
Inner PageInner Page