First, I went over the general trends and numbers of what’s going on in the mobile space – nothing in my opinion moves faster, or changes more frequently. It hard to keep-up, and new stats come out everyday.

To start here’s my presentation (hosted on SlideShare), you can download the PDF here, or listen to the podcast.

The first step (after learning a bit about mobile in general) is determining what type of mobile project you have:

• Mobile First
• Content
• Application or ecommerce
• Entertainment

Each of these have specific properties that will help inform your strategy. As an example, if you’re creating a Mobile First product – you’re going to need to target multiple devices, starting with one of the dominate mobile OSes: iPhone or Android. You’re going to most likely go native, as your project being mobile specific will need access to many of the phones core functionality. That, vs a content site with a well established .com – who would want to go with something like a mobile formatted website as a companion to the desktop site.

The second step is to get into the design process, which has lots of factors:

• What parts of your existing site need to go mobile? (if you have an existing site…)
• Who are your mobile users?
• What devices are they using?
• How do you design for mobile?
• What devices do you need to focus on?
• What technologies do you use?

I try to answer all these, and almost like a decision tree, you usually come out with a solid plan to move forward.

At the end of the presentation I go over a number of upcoming trends surrounding mobile. I’f you’re looking to keep up with mobile trends, I’ve created a twitter account that posts all the mobile related articles I’m currently reading: @mobilefeeds

Luke W. (www.lukew.com) attended my talk, and posted a recap - IA Summit: The Mobile Question – and boxesandarrows just posted the podcasts, you can download my presentation’s podcast here.

My slides make a bit more sense with me talking to them ;-) so I’d like to see everyone in the Dallas, TX area come see me at Big (D)esign on Saturday, May 29th – and if you’re getting ready for a mobile project, see me at the conference for some one-on-one.

Not that I knew it at the time, but going into User Experience turned out to be a great career move. I’ve always thought there would be job security with the number of new technologies and devices that will need designing – think of everything that will have a “screen” in the future. Who’s designing for these screens? Who’s creating the interactions, workflows, graphics? That would be us!

I often use an example of an interactive cereal box. What other aisle in the grocery store tries to communicate with you more! Let’s mix up a couple new technologies – like e-paper, RFID, and wireless power – and you have a talking, interactive cereal box. “Thanks for choosing Kellogg’s Frosted Flakes, did you know we’re the #1 cereal for vitamin A?”, “Touch here to learn more”. We’re all set for years!

One of my first jobs was at an Ad Agency that had been around since the 1970′s and at one time had 70+ people working for it. WIth production conveniences, like desktop publishing, digital photography, etc… the number of people needed had been cut over the years. You didn’t need someone to run to the photo studio to check out the day’s photo shoot. You didn’t need multiple people hand setting an ad, etc…

I wonder if these jobs are now starting to come back. Not the same jobs obviously, but the number of jobs in the Design space. Where everything is getting an interface of some kind. Phones are more advanced, kiosks are more prevalent, having a screen is cheaper than having actual hardware buttons in some cases, and with that there is more work today for User Experience professionals then there has been in a long time.

UPA just released the 2009 salary survey – and the average salary of a UX professional is $85k, and it’s steadily climbing. These are people doing things like user research, heuristic reviews, interaction design, creating prototypes, usability testing, etc… There are many things that go into today’s interfaces. It’s not just a developer adding some fields and buttons on a screen anymore. People are taking User Experience seriously – and that means following the processes, doing the leg work, and going further than we’ve gone in the past.

Speaking of jobs ;-) – the company I work for currently has nine open UX related positions right now. And that says a lot, they’ve been very conservative about hiring in this economic climate, but they understand the need for User Experience across our organization.

If you’re interesting in working with me, or at the $largecompany I work for – let me know, here’s what they currently have posted:

User Experience Designer / Information Architect
US-TX-Dallas Ft Worth – Southlake
Job Posting:Aug 28, 2009-Job Number 0071X
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=130840

User Experience Developer / Front-End Developer
US-TX-Dallas Ft Worth – Southlake
Job Posting:Aug 28, 2009-Job Number 0071Z
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=130841

Web Design Team Lead
US-TX-Dallas Ft Worth – Southlake
Job Posting:Sep 2, 2009-Job Number 0072M
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=131240

Principal GUI Developer
United States
Job Posting:Sep 2, 2009-Job Number 0072I
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=131180

Application Designer (User Experience)- Team Lead
US-TX-Dallas Ft Worth – Southlake
Job Posting:Aug 28, 2009-Job Number 006VD
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=127080

Senior IA
United Kingdom
Job Posting:Sep 1, 2009-Job Number 0071F
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=130560

Senior UI Developer
United States
Job Posting:Aug 25, 2009-Job Number 0071Q
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=130740

Web Design Senior – Senior
GB-England-London
Job Posting:Aug 24, 2009-Job Number 006P6
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=123120

Web Developer
US-MD-Bethesda
Job Posting:Aug 5, 2009-Job Number 006J1
https://sabre.taleo.net/careersection/2/jobdetail.ftl?lang=en&job=119000

And if my company isn’t for you, check out my older post on “Hiring on the Fringe” where you can find a list of sites that post UX type jobs.

(Above infographic by: http://www.good.is/)

I personally think prototyping is the way to go when creating a new software product (or any product really). You get to “blueprint” out how something is going to work, how the pieces fit together, and how it will really work once launched. I think most people are sold on the concept, so it’s a matter of how to build this close-to-real product that you can test with your user base. Do you use paper? Mock-ups? Tools like iRise and Axure, or get real and build a non-functioning ready to reuse front-end?

The first step is defining what you’re going to use this prototype for. Is it to drum out business requirements? Demo to clients before they write the big check? Or get something as close as possible to the real thing, so you can start the User Centered Design process and test your ideas on actual people that will be using your product.

Obviously I enjoy prototyping for the latter, getting real feedback that our team’s ideas were dead on, or widely off-base (never!). To do this, you really want to build the prototype in the technology you’re going to create the finished product in (usually HTML or Flex for web based software). This solves two problems: one, this truly is as close to the real thing as you can get. By using the actual UI technology you’ll be creating the final product in, you’ll know what can and can’t be done, users will get a real feeling for the responsiveness, animations, and interactions. It’s real, sans the months of backend development needed to power this prototype. And two, you can pass this finished front-end code off to the development team, taking pressure off backend developers who may not be well versed in front-end development.

Microsoft when working on Office 2007 did this very thing:

“if you’re trying to build a prototype that you want use as a blueprint, it should exist in the same medium as the final product.”

In the past when I’ve run prototyping projects, the teams usually consist of just one designer/IA, one developer, and a small amount of a backend developers time (to get some fake system data up and running). Depending on the maturity of your front-end development group, you may have sets of UI widgets and code ready to go, this will help speed up the overall process.

Dave Cronin from Cooper recently wrote an article titled “Industry trends in prototyping” – which I agree with about everything in the article – he lists out four reasons for creating prototypes: prototypes make your designs better, help facilitate communication, enable user input and usability assessment, and help assess technical feasibility and reduce development time. He’s also a fan of creating “real” prototypes where it makes sense.

I love this comment from Philip Fierlinger:

Prototypes, on the other hand, let people feel the flow and experience the relationships. Building prototypes allows architects and interaction designers to quickly identify broken pathways and iterate quickly to find better flows – by feeling the experience, rather than thinking about it in the abstract. Developers, designers and clients also get a much more tangible sense of what the end product will be.

Again, I can’t stress enough how a “real” prototype will give you the best feedback for the effort. We’ve also used these prototypes to help sell ideas to business groups. Imagine trying to sell an idea for a mobile app by letting your VP access it directly on their phone. This will beat out any PowerPoint presentation.

Garrett wrote on this topic years ago, and the technology is now easier to use than ever before. There are frameworks, open source systems, and reusable icon sets ready to be molded into your own prototype.

Using wireframes or paper for low-fedility prototyping is not necessarily a bad thing. Maybe your just testing internally, or you’re limited with your technology skills. There are discussions about what fidelity wireframes should be (both form and function). There are many tools at your disposal for creating wireframes and prototypes, and they’ve really just recently gotten easy to use. No longer are you stuck with Visio – here’s a list of some tools, ranging from very expensive to free with varying sets of features:

• Axure
• Pencil Project
• Balsamiq Mockups
• Adobe Flash Catalyst
• iRise
• OmniGraffle
• Lovely Charts
• Rapidrabb.it
• iplotz.com
• Prototype Composer
• fluidIA
• WireframeSketcher
• MockupScreens

Boxes and Arrows has an article from 2006 written by Scott McDowell, that goes over some of these options, but what’s really interesting are the comments below the article where designers talk from real world experience. And Russell Wilson from Dexo Design compares 16 prototyping tools (2008) and again, the comments are interesting.

I tend to use wireframes to quickly get across ideas and interactions. Something that could possibly be thrown away, or will be changed a number of times. Once the idea seems to stick, I move to high fidelity mock-ups, sometimes merging the mock-ups together in a slide-by-slide presentation showing the page flow with faked interactions.

GUUUI posted some links to videos showing lo-fidelity prototypes in action. Again, this can work to help guide overall concepts, but to get true feedback – you really need to have a higher level of fidelity.

If you’re in a good situation where you’re ahead of the product timeline, prototyping is your next step. Just like how a architect moves to a model, build out your prototype and test, iterate, improve, and in the end launch a successful product!

(additions)
Great post over at Adaptive Path: Rapid Prototyping Tools

Starting in 2005 when returning from SXSWi a coworker and I would put together a trends presentation talking about up-and-coming technologies, patterns, websites, etc… and 2008 is no different. The presentations keep getting longer and longer, as innovation keeps building on the previous year, moving faster and faster. This year my co-presenter was Dustin Askins of Travelocity, and we gave the presentation internally to our UX groups, and just this week at the Dallas UPA Chapter.

Why SXSWi? I think it’s really good for getting a pulse of what’s going on in the User Experience field. You get to meet with a wide verity of people from different practices, and hear from some of the top web professionals. An while there are many great conferences (like UIE, IA Summit, UX Week, etc…) SXSWi is consistent on it’s wide ranging topics (great for “T-Shaped” People).

When looking at trends across technology, marketing, UX, and business you start to see patterns of what the leaders in their respective groups are expecting for 2008 and beyond. Things I keep seeing rise to the top: Mobile, Open Platforms, Data Control, Mixing Virtual and Reality, Semantic Web, Interoperability, and Location Based tools (see slide 33). None of these are unexpected, I sure we’d all agree these are hot items that will effect multiple areas.

I’ve never posted these presentations before, so I have 2005, 2006, and 2007 to post along with 2008. So if you’re new to the web and User Experience, now is your chance to catch up on a couple years worth of knowledge.

So say hello to 2008:

| View | Upload your own

2007 On SlideShare

2006 On SlideShare

2005 On SlideShare

I also have most of this presentation in a podcast (I think my recorder battery went dead…), so listen in. Hopefully I will continue to keep this trend of my own, it’s always interesting to look back…

[EDIT 05/12/08]
Here’s some video from our UPA talk:

Me & Dustin speaking @ Dallas UPA from Jeremy Johnson on Vimeo.

As a Designer, I sometimes need to evaluate different technologies and platforms from a Designer’s perspective. Why is it important to get a Designer’s view? As Designers we can quickly be boxed in with inflexible UI layers, unusable sets of standard patterns, and the inability to create a great experience. By reviewing and testing, we can determine the pros and cons of a given technology solution. In honor of Eclipsecon 2008 ;-) I’ve put together a presentation on a popular application platform – the Eclipse RCP.

Eclipse has it’s roots as a development IDE, and while that’s very efficient for developers, for non-developers it’s not very user-friendly. For this particular technology I broke up the potential problems into four groups: Visual Style, Structure, Usability, and Focus. These were four areas where Eclipse had problems, when looking across a large number of Eclipse based applications.

The Designers View of Eclipse:

| View | Upload your own

To be fair, they are trying to fix these issues, and some very smart developer/designers are creating good applications using Eclipse. But, projects without proper UI layer specialists (Designers and Developers) will default to the problems listed out above. From a Designer’s view, it’s not easy to get a great application out of Eclipse.

One great presentation out of Eclipsecon 2008 is from Morten Moeller, titled: “Designing Business and Technical User Interfaces in Eclipse RCP Applications” which basically states current Eclipse User Interfaces could use some work, and how to made them better – with technical examples of how the presentation layer works.

This is not to say that Eclipse, as a platform is not capable of great things, but just that current popular Eclipse patterns that seem to be prevalent across most Eclipse based applications are not great from a Design/usability perspective

Remember, while the Designer’s view is very important (after all I’m a Designer ;-) there are other business needs that weigh the overall solution. Such as: development time, current skill set, scalability, etc…

With experience becoming an important factor in differentiating products, having a flexible UI layer is becoming a major factor when choosing a technology to base your product on, so if you’re part of a team evaluating different technologies, make sure your team takes into account the Designer’s view.

Awhile back I posted my “Universe of User Experience“, where I wanted to show all the pieces that needed to come together to create a great experience. This was very helpful in educating people on what User Experience was and why all the pieces were necessary. But this did not address the issue of explaining the roles of the people doing this work… So, who feeds these experiences?

Many people still don’t understand the different roles we play as Designers. Some people think “Visual Design”, while others think “HTML Coders”. “Web Designer” is a term that should only be used to describe what you do to your grandparents.

While in the past we’ve had distinct roles, the trend is to move towards “User Experience”, someone who understands many different aspects of the design and development process.

Using the ever so trendy SlideShare, you can view my quick presentation here:

You can download the PDF here.

SXSWi has come and gone again, this was my fourth time to attend and it just keeps getting bigger every year. When I first visited in 2003 (or was it 2002?) Bruce Sterling was still throwing SXSWi parties at his home and FROG Design hosted everyone in their office, unfortunately that doesn’t really scale to the size of the conference today. But, the panels were as diverse and interesting as ever – and I came back with the following brain-dump:

(note to readers, I tend to take notes in bullet-point format, which is reflected below)

Emerging Social and Technology Trends

(More detailed notes here)

• Check out: http://outside.in/
• Check out: http://www.indie911.com/
• The age of sharing your information publicly is here to stay, it’s normal for “kids” – they wonder why you are not blogging what you had for lunch
• Room to add more control, maybe you only connect with people you’ve met with in real life (RFID to Linkedin?)
• In india you can send an email to a post address, and a post to an email address

Getting to Consistency

(More detailed notes here)

• If working on a suite of applications, look for “connection points” – the apps don’t need to be 100% consistent
• You don’t need to be consistent just for legacy sake
• There is room for some discovery within a UI
• Sometimes a clean break is the best way, when upgrading applications
• Remember: Goals no Features!!!
• Integrate what is valuable and saves time
• See when your users evolve. Adobe noticed things like RAW workflow, widescreen monitors, etc… Breaks based on user habits
• Watch out for reusing objects if they don’t provide the same experience
• Design for workflows
• Capture what the user wants to do
• Adobe found users all most always select the advanced mode when given a choice, they feel like they are missing out on something if the don’t
• Pick up on user patterns
• BMW has consistent “signatures” from the MINI Cooper to the top of the line BMW
• All about goals, again – goals not features
• Make it easy for developers and designers to stay consistent with guidelines and toolkits
• Use peer review to pick up on problems in consistency

Stop designing products

(More detailed notes here)

• Design from the outside in
• Check out: http://www.flickr.com/about/

Designing for Convergent Devices

(More detailed notes here)

• 10ft design vs. 2ft design vs. 6in design
• Control, Branding, Standards, Trust
• Check out: http://www.zannel.com/
• Look for the “Golden Pathway”
• Remember the ecosystem (not just your product)
• Support: Environment, Activities, and Device (Display, Input, and Platform)
• Remember things like: Screen, Font and Colors, Input Devices, Focus States, User Feedback, Task Complexity, and User Expectations
• Have the web be a companion for mobile. If possible have users fill out information on the web, then interact with the mobile experience.
• Keep it simple, get only NEEDED data upfront – and continue to fill out a user profile as your “relationship” goes on

Mobile Design

(you can download the full presentation here)

• 60% mobile users access mobile data once a month
• XHTML-MP is WAP 2.0
• Common devices to test for: Nokia S40, RAZR, Treo, “Give-a-ways”
• Check out: http://www.deviceanywhere.com/

Moving Corporations to Accessibility

• Use tools like: Contests, Awards, and Classes
• You need a evangelist within the company
• Have guidelines and resources for your developers
• Check out: http://www.webaim.org/

Get Unstuck

(More detailed notes here)

• Make sure your team feels like they are doing good work, being productive, and fulfilled
• Have an open process, open up to other teams in your organization
• Work with Design towards a goal
• “Just add value”
• Stop too much process
• Find the middle ground between user needs and business goals
• Have one member of your team always focused on the end solution

Mobile Application Design Challenges

(More detailed notes here)

• Check out: http://radar.net/
• Remember to be aware of the number of clicks in the UI
• Check out: http://www.smallsurfaces.com/

Design Patterns

(More detailed notes here)

• Focus on solutions, encourage good behavior, and remember – “reusable…”
• Most of the good design work is done in the “fuzzy middle” (hard to provide guidelines for)

Customer Service is the New Marketing

(More detailed notes here)

• Check out: http://www.zappos.com
• Zappos has a “Culture Book” they put out each year
• A recurring job title I keep seeing from the panelists is “Community Manager”
• Find ways to get closer to the customer, let your call centers talk to design/development
• Admit mistakes
• On one forum 60% of questions are answered by users
• 30boxes – 3 employees, 30,000 users, forum only help – they spend about 4-6hrs a week on customer service

Truth about Mobile

(More detailed notes here)

• Does your mobile strategy substitute, or complement your experience?
• Advertising is not ready yet
• Data usage is almost there (currently 32%), better to be ready sooner then later

SXSW also had a good mix of keynote speakers, with Will Wright’s being my favorite of the bunch.

Overall it was a great experience – I learned a lot, while being inspired to do more.

So there you have it. My brain dump, remember podcasts and vidcasts will be available here in the near future.

In web design there are a couple things that are for the most part consistent across sites to provide a more uniform experience. Things like most logos tend to be on the top left of a page (as well as link to the homepage) and the search goes somewhere near the top right. Besides browsing the web, something most internet surfers do is shop. It could be clothing, electronics, jewelry, whatever – but this common experience has becomes very inconsistent when it comes time to buy.

I’ve sampled around 30 different product pages to see where the “action” is.
First, It’s not always called the “buy” button, I’ve seen:

• Add to Cart
• Buy this item now
• Add to Shopping Cart
• Buy Now
• Add to Bag
• Buy it
• Order
• Add to Shopping Bag

Some buttons have been crowded around product information, while others enjoy a nice amount of whitespace. The locations very, but as you’ll see here, groups do begin to form and a clear majority is formed:

(download as a PDF 1mb)

You can also click on any of these images to view via flickr

(download as a PDF 1mb)

Looking over these 25+ product pages, the thing that stands out the most are the visual design treatments. The amount of whitespace, color, size, etc… This is what draws the eye on a page, and keeps the visitors on your site from getting confused or lost.