Munir Mandviwalla

• Temple University was once the largest user of Blackboard
• Now trying to use WordPress as a way to engage professors and students in a democratic and social environment
• Students have permanent accounts with ability to make online e-portfolios
• Are encouraging open source development on the higher education front

Taking Over the World With Custom Taxonomies

Sean Blanda

• Co-founder of TechnicallyPhilly.com
• Why use taxonomy? SEO, $$$, organization
• Three types: tags, links, categories
• Now have people and company taxonomies
• Simple Taxonomies plug-in allows you to create a custom taxonomy (no crazy hand-coding as previously needed)
• Can make custom page templates for different types of taxonomies
• Justin Tadlock website has great posts about custom taxonomies
• Taxonomy templates: more information on WordPress Codex site
• WordPress.tv has videos on WordPress

Making WordPress Work AT Work

Doug Stewart

• Making WordPress work behind the firewall
• There are a number of plug-ins available to replace all types of systems within companies

Twenty Things a New WordPress User Should Know

Jim Doran

• Speaker Site
• Speaker Twitter
• Presentation Link
• oEmbed
  • Built in to WordPress
  • Can directly paste a YouTube link in to the post and WordPress automatically embeds it
  • Works for Vimeo, DailyMotion, blip.tv, Flickr, Viddler, Hulu, etc.
• Slug is the URL part of the category
• Don’t duplicate tag names and categories
• Can compare two revisions
• Don’t want to ever mess with the WordPress core
• Themes: monotone is cool, as is p2
• 2010 theme replaces the Kubrick theme in WordPress 3.0
  • Well-commented code to learn from
• Child themes: use “Template: twentyten” as a line in the header of the CSS file
• Good plugins to use
  • BuddyPress
  • SEO-All-In-One_Pack
  • Akismet (free for non-profits)
  • bbPress (in the works)
  • Custom-Post-Type-UI
  • WP Super Cache
  • Anthologize
• Use as few plugins as possible
• Custom menus
• Always upgrade when WordPress asks – keeps you up to date with security

WP E-Commerce

Justin Sainton

• Speaker Site
• Speaker Twitter
• First version came out in 2006
• Originally was a very very buggy plugin that is recently becoming more stable and useful
• Alternatives: Shopp, osCommerce, magento, YAK, eShop, e-commerce themes, etc.
• Example sites: Brooklyn Slate Co., International Fleeces, CitySurf
• New version coming out: 3.8
  • Custom post types & taxonomies
  • Uses less custom tables so it takes less of a hit on your server
  • Tax system completely overhauled
  • UI overhaul (products, categories, variations)
  • Almost 200 filters/actions
  • WP themes
• More info? Getshopped.org
• Remember that this is a platform with hooks (actions/filters)
• Chances are, if you can conceive it, you can build it in WP and WPeC
• Integrates with Authorize.net
• Questions? http://slidesha.re/bzj19L

Spooky WordPress: Disturbingly Brilliant Uses of WP

Brad Williams & Brian Messenlehner

• Co-founders of WebDev Studios
• Think outside the box
• WordPress can be used for anything!
• apps.facebook.com/autophotobook/
• http://collabpress.org – task management plugin
• http://rolopress.com – contact manager theme
• http://getqualitycontrol.com – simple ticketing system theme

Productivity 101: Making a Easily Redeployable Dev Environment with Subversion

Ryan Duff

• No good clients for Mac supposedly; I will have to investigate myself

What’s Next for WordPress 3.1

Andrew Nacin

• andrewnacin.com
• 3.0
  • No longer just about making blogs but more about making sites
  • Custom post types
  • Multisite
  • CMS
  • Twenty-Ten
  • Custom menus
  • Custom backgrounds
  • Custom headers
• Turn WordPress.org in to 3.org
  • Handbooks: split the codex in to two parts
    • 1. 5 curated handbooks; move away from a wiki and more towards a curated resource
    • 2. API reference
  • Plugin directory improvements: how do you know it works, how do you pick a plugin, ratings system, etc
  • Theme reviews: themes are now being audited for proper code
• 3.1
  • Refinement release
  • Internal linking: link from one post to another
  • Admin bar (especially for multisite version)
  • Post formats: a way for themes to build on top of WordPress similarly to custom backgrounds and custom headers; themes can specify what they support
  • Theme search: make it easier for you to find exactly what you want
  • Incremental improvements
  • AJAX goodness: going to the next post etc doesn’t require a page refresh
  • Network admin: make multisite easier to use
  • Custom post types: custom post type archives, where they show up in the menu, etc.
  • Taxonomy queries: can make multiple taxonomy queries
  • UI & UX always
  • Coming in December 2010
• 3.2
  • Moving to PHP 5.2 (developers rejoice)
  • Plugin: Healthcheck will check your php version and inspect your server
  • bbPress as a plugin: forums on WordPress by WordPress that’s being reachitected; forums in a box
  • BuddyPress: social networking in a box; bbPress can plug right in to BuddyPress
  • WordPress.tv: view all different videos from WordCamps and other help videos
  • Mobile
    • WordPress for BlackBerry
    • WordPress for iOS
    • WordPress for Android
    • All of the mobile apps are open source
• The WordPress Family
  • BYOTOS: Bring your own terms of service
  • You own your content
  • Open source
  • GPL: general public license
• Freedom is guaranteed
• The freedom to run the program for any purpose
• The freedom to study how the program works, and change it to make it do what you wish
• The freedom to redistribute
• The freedom to resdistribute
• The Bill of Rights
  • All WordPress people should be loyal to this
• The WordPress Founadation
  • Always be free!
• Have fun breaking WordPress
• That’s what I call quality assurance
• Support and documentation
• UI team (meets on Tuesdays)
• Core development
• Evangelism: go back and talk to your friend about WordPress

Angry Dinosaurs

by Cory Ondrejka

• Beware of process theater
• Agility = develop the best thing you can for your customers
• Maximize innovation = maximize experimentation
• Chris Anderson “Free”
• Detect the change that’s occurring outside your organization
  -> who will detect it first?
• Institutional incompetence is accelerating
• Look at your data! Create value and build on it
• Gather more data cheaper and faster
• Communication and learning from each other
• Be ready for your customers to compete with you when you share all of your data
• Getting out of the way: don’t make your data proprietary or inaccessible
• Driving institutional change
  • Hard to be fearless and lead fearlessly
  • Are you bold enough to admit you’re not the best leader?
  • Can you get others to follow?
• Driving transformation
  • Focus on business goals
  • Admit reality
  • Communication
  • Find internal leaders
  • Embrace agility
• How will you keep up in a world of change and Moore’s Law?
  Reality is exponential, not linear
• Failure is a reality but hopefully you will fail fast, cheaply, and publicly
• Institutions should not punish failure, especially if you learned something from it
• Experiments need expectations, reporting, and measured outcomes to avoid burning money
• Data (1), interfaces (API) (2), bully pulpit (3), get out of the way (4)

Making Sense of Usability Results

by Dana Chisnell

• Get everyone to observe the users
  • More buy-in
  • Less reporting
• Observations before solutions
  • What we heard, what we saw
  • No interpretations!
• Data sources: usability testing, user research, sales feedback, support calls & emails, training
  -> Direct observation is the best
• Focus on behaviors and then make inferences
• Make sure you get everyone’s inferences because they can be subjective
• Inferences: judgments, conclusions, guesses, intuition
  -> The wrong inference can be disastrous
• Opinions: what could we change in the UI
  • Review the inferences
  • What are the causes?
  • How likely is this inference to be the cause?
    • How often did the observation happen?
    • Are there any patterns in what kinds of users had issues?
• Observing users in their own environment is more useful than a lab, which is overkill
• Observe from a few minutes to an hour
• Design direction
  • What’s the evidence for a design change?
  • What does the strength of the cause suggest about a solution?
  • Test theories
• KJ analysis -> uie.com/articles
• Usually not A/B testing -> iterative change is better for usability testing
• A/B testing is good for disagreement among teams but you need enough people to test for viable results
• Solution jar: pay for each time you jump the gun and suggest a solution (.25)
• If you do a review without usability testing make sure you delve in to who the users are and what their tasks would be and analyze those tasks being completed on the site
• Your time is not more valuable than your customer’s time
• Analytics is not useful because you don’t know why those things happened
  -> Could be useful in analyzing drop offs in clear navigation paths
• Motivation is important for usability testing -> the users must be motivated to complete the task and would complete those tasks in real life
• Download presentation for chart
• Observation -> Inference -> Opinion -> Direction
• Debate on whether you should ask your user how they feel during the process among usability professionals
• Debrief of user after testing
  1. How’d that go?
  2. What are two good things about the site?
  3. What are two bad things about the site?
  • Pay attention to the length of time it takes participants to come up with those answers
  • You’re in good shape if can’t come up with bad things
  • You’re in bad shape if can’t come up with good things
• Come up with 5 tasks you’re going to test
• usabilitytestinghowto.blogspot.com

Web Forms: Makeover Techniques

by Hagan Rivers

• Most designs fail as an aggregation of little aggravations (“death by a thousand cuts”)
• Forms are work! Too many barriers and rules
• Makeover techniques
  1. Use your words
     • Responsibility to choose good words for your labels and error messages
     • Use the appropriate amount of words, as few as possible while still being clear
     • Avoid jargon = words that make no sense; use your users’ jargon
     • Keep instructions near the task at hand
  2. Find your voice
     • All software has a personality
     • You can shape that personality or not
     • Forms are where users do a lot of reading
     • Your brand has a voice
     • Imagine who is speaking – who is that person?
     • Don’t let software engineers do the writing
     • Have one person monitor the voice of the app
  3. Say why
     • Tell people why you require certain information instead of just making information required because people will then lie
     • Tell the user why he should enter info
  4. Prevent errors
     • Good defaults really help (filling in city and state based on zip code)
     • Don’t play “go fish” (give users suggestions for user names that are available instead of making them guess on ones that would work)
     • Don’t require formats (phone #, etc)
     • Don’t “force” the user
  5. Handle errors
     • Tell the user what went wrong
     • Tell the user what should the user to next
     • Be specific
     • Use terminology from the interface itself
     • Submission vs. inline errors
     • Brief summary at top when on submission
  6. Be appealing
     • Beware of your alignment
     • 2 column form? Put required fields in the left column
     • Reduce clutter, lines, boxes
     • White form elements on a white background have no contrast

Web-App Navigation: Makeover Techniques

by Hagan Rivers

Look up “Blinksale.”

Part 1: Theory (Types of Navigation)

1. Global navigation
   • The same on every screen of the application
   • The goal is to get the user to the main screens of the application
   • Not just a site map but putting all of the tasks in an easy place
   • Supporting the initiation of tasks
2. Local navigation
   • The navigation for here and now -> the place where I’m at
   • Manipulating or interacting with a table for instance
   • For edit screens w/Save & Cancel, no Global Navigation needed
3. Cross navigation
   • Tool for jumping to related items
   • Concierge of navigation
   • Whole goal is to save you clicks
   • 3-5 crosslinks is enough
   • Not part of the task at hand
   • Need to be hand-crafted
4. Dashboard navigation
   • Links to screens
   • Does away with global navigation
   • Users shouldn’t need to edit the dashboard if implemented correctly so don’t provide this functionality
5. Application maps
   • OmniGraffle

Part 2: Practice (Improving Navigation Systems)

1. Never use icons for navigation
   • Direct correlation between the time it takes you to think up an icon and the time it takes your user to decipher it
   • Its hard to translate words in to pictures
   • Icons are good for status and representing actual objects, don’t use it in nav!
2. Trees
   • Are super “clicky” if not done well
   • Trees don’t work when they’re really long or wide
   • Trees are a slippery slope in that everyone will start stuffing stuff in to it
   • Collapsing never works to the left
3. Pull right menu (nested menus like the OS)
   • Harder to select items
   • Try to get rid of them!
   • Indent items and stick in one menu (multi-column?)
4. Site map
   • Put in footer as secondary nav system
   • Works for long pages
   • Can indicate where you are in the site
   • Haven’t seen them as much in web apps
5. Tab explosion
   • Save tabs to where your nav isn’t going to get too long
   • Hard to find stuff, they all look alike
   • If you color code your tabs it makes your app look like a bag of Skittles, people don’t make a strong association with color so not worth it to do this
   • Eventually you will outgrow tabs
6. Menubar (menus like an OS)
   • System toolbar tucked up right at the top of the window
   • Allow you to have many commands in one space
   • Careful that the navigation doesn’t start to eat in to that actual work area of the app
   • Commands are hidden
   • Work well for global nav
   • Don’t open menu on hover, only on click!

• Start designing from inside out
  • Work on screens before global nav
  • Design global nav last
  • Keep up the app map
  • Treat the global navigation as a mini application that is separate
  • Mix and match different nav systems
  • Test users

Living With Complexity

by Don Norman

• “The Design of Everyday Things”
• Complexity is good
• Simplicity is mostly in your head – has to do with the learning curve
• Relish complexity but not confusion (lack of knowledge)
• Revolution in computer design was to make things discoverable (Mac GUI vs. Unix)
• Make it pleasurable and people will forget if it didn’t function properly or they couldn’t find what they wanted
• Increased complexity and interaction styles are coming into our lives (Android, iPhone, Blackberry, iPad, Kindle)
• Less simplicity in life – browsers and platforms are plentiful
• The experience matters
  • Memory is more important than actuality
  • Design not for the present but the memory
• Fundamental Questions of Interaction Design
  • What just happened?
  • Where am I?
  • Where do I go from here?
• All new smartphones have different rules of interaction which will be a problem later
• UI Design Principles
  • Feedback
  • Learn by Exploration (Discovery)
  • Visibility
  • Consistency
  • WYSIWYG
  • Undo
  • Menus
• Star map for iPod/iPhone/iPad
• Simplicity vs. Complexity
• Living with complexity
  1. Life is complex
  2. Tools must match life (complex!)
  3. Understanding, not simplicity
  4. Simplicity is in the mind
  5. Good design can conquer complexity
  6. Skill can conquer well-designed complexity
• We all prefer a medium level of complexity
  • This changes as you gain more skill (as with wine, music, etc.)
  • Stay in the Flow Zone
• How to conquer complexity as a designer
  1. Fight extraneous features (featuritis)
  2. Modularize
  3. Provide a conceptual model
  4. Systems thinking
  5. Design the total experience
• Features vs. power -> capabilities
• Feature creep = featuritis
• Google modularizes
• Emotions are more important than logic – logic was invented and needs to be taught
• Complexity is good, complication is bad
• Service blueprint
• Keep people informed and in the loop

Neuroscience & Good User Experience

by Dustin Curtis

• dustincurtis.com
• Realistic 3 dimensional objects activate your brain to want to touch them – your brain runs the simulation of clicking on that 3 dimensional object

1. Use realistic controls to mirror physical interactions
2. Develop spatial relationships to take advantage of the hippocampus
3. Create the experience
   • Take advantage of the locus of attention (linear path, mimicking nature)

• User experience is art – not really something you can learn from a book

HTML5: The Future of the Web

by Tim Wright

• csskarma.com/presentations/penn
• HTML5 = Markup + JS APIs
• HTML5 spec overtook XHTML2 spec
• ishtml5readyyet.com
• Full implementation expected by 2022 (two browsers)
• Doctype is shorter
  • <!DOCTYPE html>
  • Technically optional but without could trigger quirks mode
• <meta charset = “utf-8″> is also shorter
• Script and style tags are just <script> and <style> with no type attribute
• Link relations
  • <link rel=”prefetch” (loads a page in the background)
  • Put in the head
• Can make block-level anchors to encompass more area
• Redefined <i>, <b>, <cite> (italics), <small> (fine print)
• Elements removed: font, big, center, frame, acronym, axis, bgcolor, border
• Markup freedom: capitalization, quotes, and self-closing tags don’t matter anymore
• contentEditable = true
• spellcheck = true
• <div hidden></div> (hides elements)
• draggable = true (for drag & drop)
• Microdata
• Can make custom attributes to embed data
• Structural elements
  • Not block level and inline, more like text-based or grouping
  • <header> & <footer>
  • <nav> (for main navigation, mainly in the header)
  • <aside> (can be sidebar content but is really related content or pull quotes)
  • <section> vs. <div> (vary in semantic meaning)
  • <article> (blog post) vs. <hgroup> (heading wrapper)
• <figure> & <figcaption> (figure diagram photo with related caption)
• <time> (“datetime” attribute is machine readable)
• <mark> (highlight search terms inline)
• <progress> (for a progress bar)
• <audio src=”">
  • .ogg open format
  • “controls” “autoplay” “preload” “loop” elements
  • Can have fallback file formats
• <video src=”">
  • Can set up poster frame
  • Flash fallback?
  • Can make your own video controls via Javascript
• Forms
  • More labeling attributes on inputs
  • <search> is problematic; autocomplete=”off” so no drop down of suggestions (e.g., credit card #s)
  • “autofocus” & “required” (for validation)
  • Custom inputs, can use your own regex pattern
  • The “name” attribute is a must when using “required”
  • Take weight of Javascript and put it more on the browser
  • All degrade to text boxes
  • Increased usability and conversion rates
  • Easier styling with attribute selectors
  • Easy validation and less spam
• Built-in accessibility and bolt-on accessibility
  • Aria = set up roles to sections of the page for accessibility
  • “aria-atomic” (this section will reload without page load)
  • “aria-live” (“polite” re-read this when you’re done)
• document.createElement (<’header’>);
  • Elements don’t exist right now
  • Need to depend on Javascript to define them
  • If no Javascript, the whole site could fall in on itself
  • HTML Shiv by Remy Sharp
• Jaxer Server-Side Javascript (then wouldn’t matter if Javascript is turned off in the browser)
• Benefits
  • Reduced page weight
  • Speed and responsiveness
  • Higher conversions
  • Better usability
  • Happy users
  • Device development
• Javascript
  • document.getElementbyClassName
  • CSS selectors
  • More like JQuery
• Geolocation
  • GPS, Cellular Network
  • Lots of data returned back to you
  • Privacy issues – you can opt in to share
  • Gather data via Javascript
  • Check that the device is location-capable
• Storage & Sockets
  • Local storage persistent to browser
  • Super cookies
  • dev.w3.org/html5/websockets
  • Sockets not readily usable right now
• CanIUse.com
• Html5test.com
• Blackberry ships with Javascript turned off
• WebM video format
  • High quality open video format
  • YouTube committed over .ogv
  • microvideoconverter.com
• New <track> element for video

Build to Think

by Vincent Matyi

• digitalmotive.net
• @vinbenimble
• How am I adding value?
• affectivedesign.com “UX Iceberg”
• Prototypes are fundamental asset through project lifecycle
• Eliminates waste
• Provides model to conduct user research at any stage
• “Prototyping” by Todd Zaki Warfel
• The sketch is a quick way to get started
• Dan Roam books, Scott McCloud book, vizthink
• Paper prototype
• Simulated experience
  • Different levels of fidelity
  • PDF, Axure, iRise, Visio, Flash
• Production Ready
• Conduct User Research
• “Integrative Thinking” by Roger Martin
• Tim Brown IDEO
• Bitsmiths are integral to high-performance teams
• Marketing leverages human perception
• User experience crafts for human perception
• Lead With Behavior
• Discount User Research
• Planning User Research: critical to the success of all efforts
• Evidence Based Practices
• Agile Software Development
• Scrum as Science (Defined vs. Empirical Process Control)
• Alan Cooper “The Inmates are Running the Asylum”

• WordCampPhilly Oct. 30
• Splat Productions -> David Hilt
• Categorize and tag things properly for SEO
• brinsterinc.com
• Thesis platform
• Autahulapa
• Child themes = framework themes
• Thematic theme
• @lewg / goettner.net
• WordPress 3.0 new!
  • Custom content types -> added to side bar
  • Custom Post Type UI
  • GD plugin
• Woo themes
• justintadlock.com
• Enhanced taxonomoies
• Everything is a custom post type -> no more pages
• New menu system
  • Based on pages, categories, taxonomies, external links for multi-level menus
• front-page.php for front page of site
• Custom post type templates, custom author templates, taxonomy template support
• New default theme 2010 is a great start for customization
• bit.ly/bPy1mj
• TechnicallyPhilly -> Sean Blanda
  • 3 guys from Temple ’08
  • Happy Cog & Catholic Online
  • Backup plug-in
• BuddyPress
• @FlipperPA