Matt / February 19, 2009, 6:25 pm
A long time ago for a project that didn’t require much visual design work, I created wireframes in HTML. I thought I was making the handoff to our developers a little smoother, but it didn’t really work out that way. In my case, two things were wrong with this approach: 1) my basic assumption was off: creating the HTML for this project was not really the giant task that I assumed it was; 2) the code I wrote wasn’t really re-usable. *cough*
I think a lot of IAs & interaction designers have gone looking for this “holy grail” deliverable at one point or another—the deliverable that’s more than just your standard, garden-variety deliverable, the deliverable that is the shell of a site that everyone else builds upon. As far as I can tell, it never really works like that.
I forgot all about it until today, when I came across the Fluid 960 Grid System, a set of interactive page layout templates written with HTML, CSS, and Mootools.
I’m tempted to try wireframing with this framework, but I think it works best in the following situation:
- Rapid development environment (or just the old fashioned compressed timeline)
- Buy-in on using a 12 or 16 column grid from visual designers
- Buy-in from developers that they can work with this framework with few modifications
Even if 960 Grids doesn’t work as a wireframing tool, I can see a lot of potential just for getting a quick idea across, or developing a clickable prototype for user testing.
Matt / October 31, 2008, 10:00 am
Google Analytics support for regular expressions has come in handy a few times when I’ve needed to aggregate data from a few specific segments. To use regular expressions, scroll to the bottom of the report, where there is a dropdown menu and an input field that allows you to filter the data.
Without further ado:
What percentage of users are using Flash 8 or higher?
Report: Visitors » Browser Capabilities » Flash Versions
Filter type: Include
Regular expression: 8\.|9\.|10\.
What percentage of users are using Flash 9?
Report: Visitors » Browser Capabilities » Flash Versions
Filter type: Include
Regular expression: 9.*
What percentage of users are on broadband connections?
Report: Visitors » Network Properties » Connection Speeds
Filter type: Exclude
Regular expression: dialup|unknown
What percentage of users have screen resolutions 1000 pixels or higher?
Report: Visitors » Browser Capabilities » Screen Resolutions
Filter type: Include
Regular expression: [1-9][0-9][0-9][0-9]x
Note: the trailing ‘x’ ensures that you’re matching a four-digit width (i.e., greater than 1000 pixels. Without it, the regular expression will match oddball resolutions like 800×1500. There probably aren’t enough of those to make a significant difference, but the trailing ‘x’ makes the result set more exact.
Learn everything you could possibly want to know about regular expressions in Google Analytics on this LunaMetrics blog post.
Matt / July 29, 2008, 12:38 pm
I came across a great metaphor describing why multivariate testing of ad campaign landing pages (with a tool such as Google Website Optimizer) makes for a much more effective use of the money in an advertising budget.
The traditional way to do this is as follows:
- Agree campaign budget
- Build and sign off creatives (PPC ads, key words/phrases, landing page, offer details)
- Take a sack of money
- Move to top of building
- Shake money out of sack
- Sit back and hope
The better way to do this:
- Agree budget
- Brainstorm all the things we’d like to test (buttons, text, call to action msgs etc.)
- Take 5% of budget and finalise *multiples* of these elements to test
- Spend the 5% sending traffic to a multi-variate test
- Find the ideal creative (based on conversion data)
- Put this live
- Spend the other 95% of the budget
Matt / July 22, 2008, 4:14 pm
“Layered Desktop,” by Gabriel Radic.
The desktop has been the primary GUI metaphor of operating systems for the last thirty years. Over that time, newer operating systems have stretched the desktop metaphor pretty thin, in the interests of better usability and faster task completion.
For example, remember when Apple’s System 7 would open each folder in a new Finder window, creating a cascade of windows that quickly became unmanageable? That was a literal interpretation of folders on your actual desktop. Fortunately, we now browse the contents of multiple folders within a single Finder window, an activity that doesn’t transfer to the stack of folders sitting next to me.
I found the wallpaper above really interesting: someone created a solution for organizing desktop icons which makes your computer screen look more like a desk, even though the design trend has been to move away from such literal interpretations. It’s not right or wrong—lots of people find it useful, judging by the comments—it’s a creative solution to a desktop organization problem.
Matt / July 17, 2008, 1:47 pm
I can’t tell you how many times I’ve watched my mom do this. From ReadWriteWeb:
More than 10% of the searches for the top 10 dating search terms were URLs (match.com, plentyoffish.com) and almost all of the queries were something that .com could have been added to for direct navigation. If mainstream users learned to navigate using the address bar instead of the search bar – what would happen to the search economy and innovation online?
Matt / June 25, 2008, 12:32 pm
Khoi Vinh on getting good ideas out faster by collaborating closely:
TimesPeople is the result of a tight collaboration between a small team of our technologists and designers and, for a new feature on our site, they managed to launch it in something like record time. It was actually a lot of fun bringing it to life, but the really important thing is the try-it-and-see approach that drove it. Rather than spend months and millions on creating the ‘perfect’ social networking addition to our site, we decided to take a good idea and get it out as quickly as possible. It’s certainly not perfect, but we’re hoping to learn as much as we can about how social networking makes sense in the Times environment.
From “People Wanted” (subtraction.com)
Matt / June 9, 2008, 8:46 am
Courtesy of the Google Analytics blog, an introduction to website optimization and how (and when) you should use it on your site.
In summary, here’s how to optimize a poorly performing page on your website:
- Find your high value landing pages
What pages on your site have high entrances and high bounce rates? These are the “high value” pages that are begging to be optimized.
- What’s the desired goal (or conversion) for the site?
In other words, what is the ideal outcome of a visit to your site? Some common online conversions include account signup, new lead generation, joining a mailing list, or purchasing a product.
- Set up a goal in Google Analytics to track how well your landing page is funneling people toward your desired conversion
- Create a new design for the landing page you want to test
- Test it!
We were told at the LunaMetrics training session that you can expect actionable results within about a month, depending on the traffic to the page being tested. You could see statistically significant results in as little as two weeks in some circumstances.
Talk to Caleb or me if you want to know more about website optimization or if you have questions about the jargon. We’ve been scouting a few pages on our sites in need of optimization and could always use more practice.
Finally, the Website Optimizer team has a blog that’s worth a look. I recommend starting with this case study, in which conventional wisdom about the use of imagery on the homepage is tested.
Matt / May 23, 2008, 9:51 am
I’m very curious.
My off-the-cuff prediction is that casual Facebook users will see this as just one more piece of clutter and heavy Facebook users will embrace the flexibility. But just because it makes things messier or less consistent visually doesn’t necessarily mean its a bad design idea. It seems like a clever way to allow users to experience the page layout freedom they had on MySpace, but within the constraints of a rigid Facebook UI. Whether that’s what Facebook users want remains to be seen—Facebook has had more than its share of problems pushing unwanted features out to its user base.
Matt / April 23, 2008, 9:42 am
From Khoi Vinh’s ongoing Q&A session:
Over the past two-plus years, as The Times newsroom has embraced blogging with tremendous alacrity, we’ve created over 150 blogs, and over a third of those remain active today.
The challenge is even more complex when you consider that, though each blog has its own needs, the vast majority must be based on a single template (within WordPress, our Web log publishing system) that manages all of the blogs together. As you can imagine, that requires that the template be very versatile and that our designers be very nimble.
So by virtue of the fact that we’re constantly launching new blogs, we’re also in a perpetual state of revision and refinement. We’re fine-tuning the typography, adding new features to the right-hand column, incorporating new kinds of media content into the articles, etc. All of which is work that may then be reflected back on the other blogs.
I find this really remarkable. I can’t help but wonder how difficult it was to get stakeholders to agree to the constraints of a single Wordpress template. By standardizing the blog creation process, they now have an agile publishing system that imposes creative constraints but has been able to grow rapidly with nytimes.com.
Imagine being the guy in charge of maintaining these blogs though.
Matt / April 14, 2008, 12:23 pm
This year’s IA Summit just wrapped up in Miami and as usual there are several sets of slides that made me wish I had gone. Not surprisingly, I was drawn to Leah Buley’s presentation “How to be a UX team of one.”
A bunch of others look really interesting too, and relevant to others outside of the IA/UX practice:
