SEO

What is SEO - Search Engine Operation
3-5 Things you can recommend to clients to help them optimize their results

How important is your content?
Keywords, what are those?
Popularity?
What did Google say?
Site maps?
robots.txt?
Alt attributes?
How does css zengarden relate?
Titles? (length 65-75)
Meta Description?

Final Presentation Details

Final Details
7 Group Presentations
Each group will spend no more than 20 minutes.
Expected Presentation Content

• Reintroduce team
• What is their business goals? What is the goals of their website and mobile?
• Summarize your Personas
• Describe your groups strategy for making their online and mobile experience successful
• Include Strategies: Identity, Social Media, Design, Content, Mobile
• Walk through Web Experience via common/critical tasks 

Meeting expectations....

• Bring handouts and electronic versions of site and presentation for client and me
• Be ready and on time; Have functional prototype and presentation cued up and ready to go
• Have files/URLs for client available
• Back up your design strategy
• Continue to show how you listened to the client; show that you are smart
• No sleeping, dozing, texting, checking email, working on your PPT while others are presenting

Groups who want A's....

• Have well organized, navigable, thoughtful & compelling design solutions for the client
• Act and speak as a team; Spread out speaking points
• Back up Strategy with Research (secondary or primary);Utilize topics from class/readings
• Manage their time appropriately
• SPELL CHECK!!

CSS Zen Garden Help/Hints

I have had a few questions about help with Zen Garden.  Hope this helps...

First...

• I encourage you to explore the library of properties/styles CSS provides for you to experiment with . I want folks to try and push the limits. I know it's a technical assignment, with a demo that happened weeks ago, but I'll be looking for some trial and error.
• Also, there's specific Dreamweaver CSS tutorials here, or go to youtube and search 'dreamweaver css' 

Here's a style you can apply to any class completely hide an area (which is ok, and may be good for mobile version):

display: none;


Here's an example on how you redefine the A (link) tag:

a {

font-family: "Arial Black", Gadget, sans-serif;
font-size: 16px;
color: #F00;

text-decoration: none;

font-style: italic;

}

NOTE:

• 'text-decoration: none' hides the underline
• More text decoration options here

Here's how you can add an image in a div:

.area5 {

background-color: #CCC;

height: 400px;
width: 400px;
position: absolute;
top: 250px;
background-image: url(image.jpg);
}

NOTE:

• 'image.jpg' is an image you include in the same folder as the HTML and CSS files
• You can move the image using property (absolute) and setting top, left, right, more here
• You need to adjust the size of the height and width to be able to view the background image
• View all the things you can do (styles you can add) here
• You can add these styles to all areas, not just area 5

  

 

Nov 28

6-6:15  Prep for Final;Testimonials
6:15-6:45 CSS Zen Garden Exercise Fun
6:45-7:30 SEO In Class: http://www.seomoz.org/beginners-guide-to-seo
7:30-7:45 Break
7:45 - Class End  Mobile Prototype FUN

Testimonials

Testimonial 1

Four Paws was professional and efficient, their company was just what we needed.  We have treated our library three times in 4 months and before we gave in to another treatment, we asked Four Paws K-9 Detection to come in and use their services.  Their beagle, Marley, did her job well and detected bed bugs in our library.  Marley is a tender, gentle dog!  We had Marley inspect other classrooms and there were no other hits.  If there was going to be a hit, it was our library and Marley proved her keen sense of smell was right on target.  It has put our minds at ease in that we do not have a widespread problem.  We will be following up with their services again after our next treatment.  I would highly recommend their services to anyone who is in doubt whether they have bed bugs before they spend a lot of money on treatment.

 

Jill Smith, Treasurer

Jefferson Local Schools 

 

 

Testimonial 2

Four Paws has been a pleasure to work with.  Not only are Kelly and Annie experts at what they do, but they also are compassionate people who have a genuine interest in helping others.  They understand how frustrating it can be to deal with this issue.  From my experience, they have always been flexible to meet our scheduling needs, thorough with their inspections, and available if we have questions or concerns.  Thank you for the important work you do – you are helping so many people to get their homes and businesses back in order and restore their peace of mind.

 

-J.F., Columbus, OH

 

 

Testimonial 3

Our company is based in New York City and we were referred to Four Paws K-9 Detection, LLC to use them as a sub-contractor for one of our clients. From day one Kelly and Annie have been extremely helpful.  Their prompt response to any email or call sent their way makes it very easy for me to make my client happy. Once an inspection is completed the handler on site sends a detailed report immediately.  This allows me to communicate the results to our client before they even ask.  Typically we request that inspections be done in the middle of the night and it does not phase them at all.   They have far exceeded our expectations. I have never been to Ohio, but I feel like I have friends there. 

 

-Kelly Gonsalves, Assured Environments, NY.

 

Testimonial 4

Four Paws has helped my family feel at ease about checking for bed bugs!  Kelly Robbins is always prompt, efficient and professional.  I love that I can count on Kelly and Four Paws for reliable service every time.  I highly recommend Four Paws!

 

Cincinnati Oh

Nov 7

6:00-6:45

• Prep for Nov 14
• Nov 28 - Usability Testing 2 "squash" in lieu of reviewing final, pepping for final, turning in CSS assignment
• Prototype Questions 

7:00 - 8:30

• CSS, Primer and CSS Zen Garden Assignment

Bed Bug Zen Garden Exercise (Due Nov 28)

Purpose - To challenge you with a small exercise that shows the fundamentals of CSS and HTML, while illustrating responsive design.

Each group will create two CSS versions of the same HTML provided

• Version 1 - Web version
• Version 2 - Mobile Version, sized for smaller displays

Be sure to redefine the A tag - Also for the mobile, check out 'display:none'

You will be judged by the class on (1) executing without editing HTML (2) creativity of solution

DOWNLOAD HTML and STARTER CSS

DUE: Nov 28

NOTE: This is separate from main project for the client.

Zen Garden

Prep for Nov 14 "Bring a Friend Day"

Prep for Nov 14

1. Bring a Friend Day - Yes, each group will now need to bring 1 friend. Ideally, someone: (1) who has no idea what the project is and (2) someone close to your persona, (3) someone without design experience
2. Ask friends to particpate from 6:15-8:00 (or earlier)
3. Clients will be here
4. I'll ask general information about each person for everyone to take notes
5. We'll conduct 1-1 Usability Testing Sessions, clients will observe only. You will be testing the interactive prototypes of the website, but bring mobile. 
6. After the session we'll "Triage" - each group will highlight (1) common problems they observed, (2) a-ha!s, (3) behavior themes (not neccessarily problems)
7. (I will bring snacks)

General Information (I'll ask to all friends at once)

I'll ask them to write their answers on a piece of paper. This will avoid having to ask the questions time and again

• What's your profession?
• Comfort level with using the internet (beginner, moderate, expert)
• Amount of time/day you spend on the intranet?
• What type of things/activities do you normally do on the intranet? (excluding smartphone)
• Do you own a smartphone?
• If so, what are typical websites you access from your smart phone?
• How much time do you spend on the intranet on your smartphone?
  
• Have you ever suspected of having bed bugs in your house/apartment?
• If so, what did you do to confirm they were bed bugs?
• If not, what would you immediately do to confirm they were bed bugs?
• If you were on the internet, what would you search for to find out ways of confirming?
• Are you aware of businesses that can help detect bed bugs?

Usability Testing Sessions

• First question should be 'What do you think the purpose of this site is?'
• Prepare 10 task-specific questions. (we can discuss some of these)
• Essential question at end: Would you reccomend this site to others?
• Essential question at end: What would you expect a mobile version of this site to be? (show yours) does this match your expectations?
• One person ask questions, the others take notes - ROTATE

Tips:

• Avoid leading questions
• No pointing
• Don't feel you have to answer their questions, use: "what do YOU think it should do?"
• Use "Is that what you'd expect?"

For Nov 7

• Make updates based on feedback
• Start trying to make interactive, bring questions
• Bring initial Mobile wireframes

October 29 Office Hours

I will be available in Hayes Hall room 130, 6:00-6:30pm, and 8:00-8:30pm on Monday 29th. Let me know if you would like to meet prior please.  
 

For October 24

Thanks for participating in the field trip. I hope it was interesting.

For next week please:

• POST YOUR IDENTITY STRATEGY (if you haven't already)
• Each group should post a response about something you learned at the field trip that relates to this class or your project
• Also - bring your updated wireframes WITH content.

I will be speaking with each group individually.

Phil

For October 17

Don't forget the field trip: 6:15pm, 1111 Polaris Parkway

Post Identity Strategy
We know identity is an issue with this business. I want you to outline your proposed identity strategy. Be sure to include your strategy (what and why) around:

• Business Name
• Web site tagline
• Logo
• URL/domain name
• Email
• Facebook name
• Twitter handler
• YouTube, Linkedin, any other

Update wire frames to include ALL content

Web 101 (Things to Know)

How the Web Works

• HTML
• Scripting Languages (Java Script)
• Browsers
• CSS

 Designing a Page

• Colors - RGB
• Graphic Formats - Compression
• JPEG
• GIF
• PNG
• Image Resolution 72,
• Page Resolution
• Font Use/Choices

Oct 10

6:00 - 6:20 Social Media Strategy
6:20 - 7:00 Web Authoring 101
7:00 - 7:15 break
7:15 - Paper Prototype Testing

For Oct 10

Post Social Media Strategy

• How and (more importantly) why should Four Paws utilize Social Media sites as part of their site strategy?
• What should they expect to do (with the social media sites) to be successful?

Bring Wireframes

• Rough, informational wire frames. You can introduce color, branding ideas to test and gather class feedback.
• You should have enough wireframes to test this scenario:
  A woman finds a couple bugs, she thinks are bed bugs. She's distraught. Four Paws came up in first page of results. She uses the site to (1) validate it's bed bugs, (2) understand what's the process of detecting them with the dog (3) understand the price of detecting AND the price of removing, (4) contacting Four Paws to schedule an appointment.
• We will test them in class.

Themes from Progress

About their site:

• Identity is getting in the way
  
• They can do a  better job organizing the site
• Lack of connection with site and services
• Less text
• Pricing should be spelled out, but flexible
  
• Don't focus on the dog/Marley
• Name and URL long
• Need for Testimonials
  
• Angies List - Worth Taking risk
• Educate on the Process
  

 Differentiators

• Women & Care about the Privacy, Caring
  
•  Individualized Service

Social Media
Pros:

• Modern/Relevance 
• Exposure
• Business to Business
  

Cons:

• Discretion

Facebook over Twitter

Oct 17 Field Trip Info

1111 Polaris Parkway, 43240
Front Entrance
6:15



Carpool

Vanessa - could come to campus (Hannah, Jenna, 1 more)

Ian- on campus (Jake, Jenny, Lauren people)

Catalina
Eve

October 3

October 17 Field Trip
Did everyone post their progress documentation?
Research Themes - What did we learn from each other?

Quick discussions

• What should you design first? Order?
• Tagline importance?

Reading Response Activity -

• Each group will take on 1 of the 7 topics below
• You will use real web examples to "teach" the topic (3 minutes)
• You will discuss how you will apply this to your project (2 minutes)
• 30 minutes prep, 5 minutes each 

TOPICS:

1. Home Page Balance of Content, Identity & Navigation and Timeliness
2. Adaptive Design & Selective Display
3. Consistency, Contrast, Color & Contrast with Typography
4. Page Length, Page Headers & Footers, Vertical Stratification
5. Design Grids, Good and Poor Management of Hierarchy of Contrast
6. Aliased type, Anti-aliased type, Legible typefaces, Screen Based Type Faces
7. CSS

For Oct 3

Post progress reports
Post research themes, client feedback
Read 6,7,8

Progress Critique Details

Structure (present in this order)

INTRO

• Introduce yourself
• Echo the business goals of For Paws

RESEARCH

• Competitor Analysis - answer: who's your competition
• Research Summary - answer: what did you do? who did you talk to?
• Persona - answer: who are you designing for?

STRATEGY

• What do YOU think they must do to be successful?
• What are their opportunities?
• What should differentiate them from others?

ORGANIZATION & DESIGN

• Site Diagram - answer: how should the site content be organized?
• Wireframes - answer: how should the page content be organized?

Meeting expectations....

• Include above presentation content
• Be ready and on time
• Have presentation cued up and ready to go
• Show your strategy
• Show that you are smart
• No sleeping, dozing, texting, checking email, working on your presentation while others are presenting

Groups who want A's....

• Utilize topics from class/readings
• Reference findings from research and class exercises
• Act and speak as a team
• Spread out speaking points
• Manage their time appropriately

Sept 19

6:00 - 6:20 Research Updates, Competitive Analysis
6:20-6:45 Expectations for Next week's Progress Critique
6:45-rest Information Architecture In Class Exercise

1. Inventory your content: What do you have already? What do you need?
2. Establish a hierarchical outline of your content and create a controlled vocabulary so the major content, site structure, and navigation elements are always identified consistently;
3. Chunking: Divide your content into logical units with a consistent modular structure;
4. Draw diagrams that show the site structure and rough outlines of pages with a list of core navigation links; and
5. Analyze your system by testing the organization interactively with real users; revise as needed.

Usability Testing

Mention:

• "Think aloud"
• "Act as if I'm not the designer"
• "You can't be wrong"

YOU SHOULD ASK FIRST

• Intranet savvyness?
• What do you use the intranet for? (purchasing, research, games, etc.)
• What's the purpose of the site?
• What do you think you can do first?

YOUR TASKS GO HERE

YOU SHOULD ASK AT THE END

• Would you reccommend this site?
• How many people do you think made this site?

[YOUR OWN]

Reading & Video Response # 3

1. How was the usability test organized from how you can recall? - doesn't have to be perfect. (bullet-out the basic steps)
2. Name 3 differences this has to an traditional interview
3. When do you think is the best time to conduct a test like this? A. Before the site was built, B. After the site was built.
4. How many of these tests are necessary to understand how effective a web site is? (you can't be wrong, just interested in your guess)

5. What's the purpose of the 10 Heuristics?

Sept 12

Mobile
6:00 - 6:15- Go over last weeks Response
6:15 - 6:45 - Review your charters, how's research coming?

Usability
6:45 - 7:15 - New Reading Response
7:15 - 7:30 Break
7:30 - rest Usability & Heuristics & Wireframe exercise

Next week, read, chapters 3,4,5.
Bring content
Work on research

Affinity Diagram Results

Project Charter

Business Goals
Number one choice for bed bug detection; Top of Google list
Reach a wider audience
Make money

Web site Goals
Grab attention, deliver information
Consider other other services
Easy to navigate to answer questions

Users Tasks- Things they want to accomplish
Basic Information - Contact Info
Services
What is the cost? Why would people pay this much? What's the value? How available?
Scheduling an Appointment

Differentiators/Opportunities
Prevent folks from going to many places; cost comparisons

Audience/Behavior
Residents
All ages - over 18-75
Women - Mothers - People with resposibility
Some Men
Go once compare and then come back
Business
Off campus Landlords
Office Managers
Potentially Hotels
Call Centers
Airports

Reading Response #2

How is accessing information on mobile devices different than the web?

What mobile device capabilities could benefit Four Paws?

Participatory Design Research

http://uxthink.wordpress.com/2010/11/10/participatory-design-research-part-1/

http://www.servicedesigntools.org/

Started in Scandinavia in the 70's
Empowering workers

Consider

• Design Activities - When?
• Representation - How?
• Recipients - Who?
• Content - What?

IN CLASS

Affinity Diagram
http://www.servicedesigntools.org/tools/23
http://www.mindtools.com/pages/article/newTMC_86.htm
The affinity diagram is a creative process used for gathering and organizing large amounts of datas, ideas and insights by evidencing their natural correlations.

RANDOM IDEAS > GROUPED IDEAS

Today's Problem Statement:
What's 12 of the most important things this Four Paws should consider in using digital media (web & mobile)?

• Each group writes on a sticky note
• place sticky notes on bigger sticky note
• As a class we'll group them

September 5

6-6:30 Go over last week's response/ Draft Charter together
6:30-6:45 Reading Response #2
6:45-7:30 Mobile first discussion/ Four Paws
7:30-7:45 Break
7:45-8:15 Review Research Plans
8:15-9:15 Participatory Research - Affinity Diagram

Next Week: Watch Usability Video & Read 10 Heuristics (See Course Outline)
Post Charter for Web & Mobile - Outlining: Business Goals, Goals for web site, Goals for mobile, Key Task for web site, Key Tasks for mobile, Audiences for web and audiences for mobile

Bed Bug App

What's the purpose?

Reading Response # 1

Based on Chapter 1 & 2, what are 3 points of advice you would give someone planning a website?

Based on the Design Styles reading, what style do you think we'll be attempting this semester?

Groups

1. Sejun Patrick Eve
2. Anthony Devin Catalina
3. Kevin Vanessa Hannah
4. Mackenzi Jenna Aaron
5. Chris Jaro Alfred
6. MJ Jenny
7. Ian Thuan

Notes from Client

Four Paws
http://www.fourpawsk9pestdetection.com
made by go daddy

Started in 2011

Marley - detection- feeds
5-10 feet range

Grow colonies
Bed bugs eat blood, they feed and hide
Female bed bug, impregnated once, lay tons of eggs

Bed bugs doesn't depend on old buildings


60/40 find them

Doesn't damage a house

Bed bugs considered a neusance not a hazzard

US: Epidemnic, maybe Pandemic - can be an abuse because of the bites in old-folks homes

Will come right away - work the dog 6 hours

Competition

• Rose pest solutions - 2 in this area, 1 or 2 in michigan
• Bed Bed Inspector - BBI - will underbid - single dog
• Buckeye Bedbug Dog- single dog

Places

• No hotels - but you want them - code enforcement 
• Call centers
• A couple places to a monthly service

How often - This week 1 everyday, but peaks and valleys

Expanding more than 1 dog, maybe bring some one on

Dog costs, 11k, NESDECA certified, $250

What makes us better - Counseling, Warm, Independent, Women Owned, Discrete, Continued Service, Taking the Extra Time

Detection - Dogs, flashlight, Dry-ice,Verify

Service all of Ohio - some in Kentucky

Residential & Commercial

$175 Dog a house, about an hour
If they find it could be $100's to $1000's

Packtight - to stay clean

Put in a bag, don't squish it

Connection with:
http://www.varmentguard.com exterminates, cross reference
Go in before and after, proactive reactive

IPM = Integrated Pest Management -

Why? Passion - ah ha moment, teaching

Education opportunity

Audience

• People are extremely anxious
• %90 Females
• Would like worried Parents
• Mostly through referrals

Bed Bug TV

Have Podcast with Shawn Ireland

Dont discriminate on income

Have QR code

Have an office? No - keep costs down

how do people engage you? I would like to head on top

Facebook and Linked

Clients utilize TV

Yelp? - Worry about the damage

Angie's List? - Worry about the damage

Not sure if I'm not allowed

Colors - Logos - Brand identity - invested

Email me, text me, leave a voicemail

Use google docs and calendar

Open to referrals

Glen Neidham

From Client:

• Testimonials? capture
• Site metrics? go back.

Assignment: Research

User Research

• Each group, conduct 4-5 interviews, contextual interviews or survey
• Purpose: How do people that may fit this persona use the web, make decisions - what would change their behavior, what sites do they like, what are their pet peeves
• We will do some form of Participatory Research in class

Competitor Analysis

• Each group will find a unique site to analyze (check with other groups)
• Purpose: How are competitors addressing this? What are differentiators? What are users expecting? What are they doing well, what are they not?
• See 10 Heuristics as a benchmark (will discuss in class)

Personas

• Each group will develop a primary and a secondary persona
• Personas need to be believable, based on their observations/data, and different from each other
• They should have a photo, quote, bullets of attributes, and small narrative
• http://uxmag.com/articles/personas-the-foundation-of-a-great-user-experience

You will post summary of all on your own team blog. You will present these to to the client on September 26.

For Next Week post a Research Plan on your team blog.

August 29

6-6:30 Reading Reaction
6:30-7:30 Meet the client
Break
7:45-8:15 Create Groups
8:15-8:45 Research Assignment

Dont forget read/click thru Mobile First (in course outline)

Make group blogs, team names

Bring a Research Plan next week

Killers Song I Like

All these things I've done...


(don't forget to read :)

First Class (1)

Introduction - me and you
Course expectations, outline, grading, text
Vocabulary - what does it mean to you, what does it mean to me?

• HTML
• Browser
• Web Application
• CSS
• User Experience
• Interface
• Usability
• User Research
• Focus Group
• Usability Testing
• Information Architecture
• Persona
• Heuristic Review
• Wireframes
• Accessibility

Mental Models - Watch Video
Expectations Rising


Affordance (the thing tell me I can ...)
Cultural Convention (my culture tell me I can...)
Physical Constraints (the world has limited this thing to do what...)
Logical Constraints (a designer or engineer has limited it thing to do what...)

Usability Test Exercise

Main Project - Type of Web Sites

About the client: https://www.facebook.com/four.paws.k9.detection

Welcome to 5405

Course Details

Context
This course is structured to provide experience in the area of interactive visual communication and interface design. Students will apply course principals by creating an interactive Web site that integrates navigational elements with images, sound, and motion, founded on strong user-centered design and typographic principals.

Format
This is a progress-oriented auxiliary course that requires active student participation. Class will meet 1 day per week for approximately 4 hours each day. Class sessions will be comprised of lectures, demonstrations, and assignments. An equal balance between theory and application will be expected.

Objective
This course aims to provide students with an opportunity to learn about important design principals of interface design and the significance of integrating it with effective interaction design. Students will address issues concerning the innovation of screen-based communication and the challenges associated with them. Design solutions should address the specific requirements and abilities of the user audience, be easy to understand, and support the structure, meaning and purpose of the information. It is the intent of this course to provide students with an adequate background in Web site authoring and current associated technology (and limitations).

Team Blog

All teams must have a Team Blog. The purpose is to post deliverables, show progress, share contact information, and collaborate. It must consist of a team name, and branded appropriately.

Main Project

In this class you will create a multi-device user experience strategy for a local business (4 Paws) following the user centered design process. You will create a working prototype for two devices, web and mobile.

The deliverables will be:

• Charter
• Research & Competitive Analysis
• Personas
• Wireframes
• Clickable Prototypes
• UsabilityTesting Plan &Scripts
• Analysis
• Functional Prototype

Including: Mid year and Final Presentations

Example wireframes for multiple devices:

Interfaces