Archive for the ‘information architecture’ Category
Monday, March 9th, 2009
I happened to pick up a complete issue of the New York Times paper edition yesterday and I had a strange, disconcerting experience. I suppose you could call it déjà vu, but I think it’s slightly different, slightly more explicable than that…
I had given up my daily subscription to the Times two years ago, subsisting now as a “Weekender” and the truth is, I am paying $3.45 a week for the New York Times Magazine, since that’s the only section I really read. The rest, as they say, is “fish wrap.”
All other days, and even weekends, therefore, my daily experience with the Times is through its superb digital online product. So there I was, waiting in the hallway of my office, waiting for Ryan to come in since I had left my keys inside in my rush to leave the day before, and, bored, I picked up the newspaper someone had left for recycling, fully intact. After scanning the front page for a second, I realized that I had seen each of these headlines the day before online.
I hadn’t read each article, of course, but as I flipped further, I thought to myself, “So that’s where they put that article, and oh, I didn’t realize that one got the entire front page of the business section!” It was like someone had come in and re-arranged all of the furniture in my apartment, with different priorities and a different sense of order.
And one of the beauties of this post-digital encounter was that I stumbled on a fascinating article which hadn’t been on the “most e-mailed” list and it was a blip in the parade of articles on the homepage that day. But there it was, front and center on the business section:
Google in the paper
Google, the online giant, had been sued in federal court by a large group of authors and publishers who claimed that its plan to scan all the books in the world violated their copyrights.
As part of the class-action settlement, Google will pay $125 million to create a system under which customers will be charged for reading a copyrighted book, with the copyright holder and Google both taking percentages; copyright holders will also receive a flat fee for the initial scanning, and can opt out of the whole system if they wish.
But first they must be found.
The article was about Google’s campaign to satisfy the terms of this class-action settlement, payback, if you will, for attempting to scan and offer digitally every book in the universe, to compensate the authors and copyright holders for this use of their “property”. The irony was that, in order to achieve this, Google was taking out half page ads in newspapers all over the world, an undertaking only Google could pull off.
Fancy, that: Google having to use paper to distribute information.
It just goes to show: print is going to recalibrate itself from what it used to do (everything from phone books to news to long texts to novels) to focus on what it does really well in a digital, networked world (not hyper-fresh news, not phone books, on-demand magazines and books, and information distribution off the grid).
Tweet This Post
Monday, January 26th, 2009
Aya and I were watching the trailer for We Live in Public on Sunday and there was a line that said something to the effect of “blah blah mumble being online all the time mumble mumble like an addiction, it’s like Attention Deficit Disorder blah blah” at which point Aya shot me an accusing glance, in a kind of non-verbal intervention.
Okay, I admit it (that’s the first step towards recovery, right?). I have a problem. I am online most of my waking hours (see my self-analysis). Rarely do my computers ever get switched off (I just sleep them). I can argue that it’s my livelihood. I can say I’m trying to be one of Malcolm Gladwell’s Outliers and that I have to amass 10,000 hours of, um, practice so I can be an “expert” on teh internets.
But the truth is, I like the feeling of knowing what’s up with my network, and the rest of the world. I am more aware than I used to be. I care about politics because I am more engaged. I can blame part of it on genetics. Growing up, my brother and I would rarely be without a book. I used to carry a huge backpack filled with books wherever I went — in fact, I would feel naked without the weight around my shoulders. My brother ate sci-fi pulp novels for breakfast. (He is actually a freakishly speedy reader, eating entire pages in a glance.) My dad would spend hours sitting on the toilet reading scientific journals (xeroxed from the library).
from thingsmagazine.net
The point I tried to make is that the only thing that’s changed is that we’ve shifted the same activity from “atoms to bits” (as Nicholas Negroponte likes to put it). No more 50lb backpacks; just a 4lb laptop. Instead of reams of paper, which are now gathering dust in a box taking up space in the basement, I now have Evernote, del.icio.us, and Google Reader that live in the airy Cloud.
The thing we can’t seem to get over is this: when it’s on paper, it’s okay. But when it hits the screen, somehow it becomes problematic, stigmatized, it’s an “addiction.”
One way of looking at it is that we have gotten lulled into the idea that if something made it into print, it had to be knowledge. But we now know this is not the case. We’re all in a jumble right now. The computer is the locus of too many activities: work, play, banking, browsing, rubber-necking at the train-wreck of humanity, study, creativity, etc. They are all crammed together and flattened out such that the bad taints the good (never the opposite).
Two designers in London have printed Things Our Friends Have Written On The Internet 2008, which is a publication of “stuff from the internet…printed in a newspaper format”
Another way of seeing it is from a very physical reality. For all its atomic encumbrances, the book is portable, and computers, surprisingly less so, though that all is changing. I am seeing more ordinary people whip open their laptops on the subway, more people reading on their phones, and a new wave of netbooks is hitting the streets. The screen forces us to come to it. It emanates information, and it is information of an altogether new and different quality because it is born on a screen and is meant to live on a screen, never to be frozen in print, and we are entranced by its flickering aura.
Tweet This Post
Wednesday, January 21st, 2009
Karl (netProtozo) and I have been working together for almost 8 years off and on, and now we share an office, where we consult and work on projects together.
Karl whipped this little grid generator up today. It rocks for several reasons. The first is it’s the result of our having worked on large-scale sites and our approach is reflected in it, like the idea that there should be an underlying fractional unit for the columns, gutters, and super-columns. The other feature is invisible, but it hooks neatly into the HTML framework we’ve been developing (and the project that is codenamed Morpheus). This approach has been used on GOOD and Conductor’s beta application.
Have fun!
The netProtozo Grid Generator
The netProtozo Grid Generator
Tweet This Post
Thursday, November 13th, 2008
What is a wireframe?
Depends on who you ask. I like to define a wireframe as equivalent to a keyframe in a storyboard. (The problem is that most websites are not linear, but that’s a topic for another post.) I’ve done thousands of wireframes in my career as an Information Architect/Interaction Designer (have we settled on an appropriate title yet? I guess not). I don’t live for wireframing, even though making them is one of my most marketable skills. I have developed a very pragmatic view of it, having seen how my wireframe “bibles” are clung to by business customers, salespeople and QA, and then unceremoniously forgotten after the first beta launch. The tricky thing about wireframes is that they can mean different things to different people, depending on what stage of the project you’re in.
So now I have developed a Zen-like detachment with wireframes: they are ephemeral. In fact, I make it a habit of suggesting to clients that we schedule into the project plan a wireframe bonfire, usually sometime after launch. Every time, I get a double take and a laugh of disbelief. Why a bonfire? To emphasize the reality of the end goal, the working application itself. Users don’t use wireframes. Also, I want to make the point that wireframes are dead and the application is alive, that decisions that may have looked great on paper may, in reality, not work when put in front of real users.
The Evolution of Wireframes
Wireframes need to evolve over the course of a project. For larger projects (3 to 9 months) I’ve found it useful to clarify both for myself and the business customer what to expect from wireframes at different stages.
Lo-Res
In the nascent stages of a project, when ideas are being thrown about by all stakeholders and everything is in flux, lo-res wireframes may appear on anything from whiteboards, scrawled on the backs of napkins or scrap paper. Think of them as thumbnail sketches.
Lo-Res wireframes should be
- Sketchy
- Loose
- Quick
- General
- Monochromatic
An example of a Lo-Res wireframe
Usually, I will gather these scraps of paper and translate them into digital roughs.
A digital Lo-Res wireframe
Note the “default” style for everything:
- Labels should be descriptive of the content. Avoid using real copy (except for logo)
- Content areas are grey blocks with the label in the top left corner
- Multimedia or graphics are indicated by a different grey box, with label centered in middle
- Buttons are indicated by rounded corner and centered label text
Not using copy is important at this stage because you don’t necessarily want the client focusing on details yet. It can be distracting from the larger goal, which is that you want to get agreement and sign-off on basic proportional representation of types of content and their general hierarchy. At this stage, you should be able to use this to answer the question: What are the primary, secondary, and tertiary content blocks on the page?
Medium Res
Once you have established what content needs to appear on the page and have a good sense of their general hierarchy, you can start to add more detail, in the form of more realistic headings, navigational copy, and basic indications of functionality.
A Medium-Res Wireframe
As you can see, there’s a little more resolution here, like you’re adjusting the focal length so that you can make out more clearly the major elements of the screen. But you’ll notice that not everything is in focus yet, namely the body copy, which I like to represent as grey bars to give an idea of type density without getting bogged down into specifics yet.
I’ve found that once you start introducing dummy copy and dummy data, the viewer’s expectations and reactions start to change, regardless of your frantic entreaties to disregard such characteristics. There is a point at which our attention begins to hone in and we start to notice certain elements, unconsciously or not, and it takes all of your discipline and awareness as creator of these documents to modulate the viewer’s expectations through the blurring and smudging of various elements (at one point I considered applying a “Pencil Sketch” filter in Photoshop to my wireframes). But at some point, you will have to address these things, such as color, highlighting, typography, dimensionality, and data, which will bring your wireframes to to a higher level of resolution and expectation.
Tomorrow: I’ll dig up some Hi-Res wireframes and talk about clickable prototypes, the ultimate in high-resolution wireframes. Stay tuned!
Tweet This Post
Sunday, November 9th, 2008
(This is a continuation of Part 1 of “The Page is Dead”.)
What is a “page”?
We haven’t had to think about this question for the past three hundred years or so because it’s so obvious to everyone what a page is. We’ve just been staring at them so long we take them for granted.
It’s a sheet of paper.
OK, it’s a sheet of paper that has words and pictures on it.
A book or a magazine has a bunch of them bound together.
Simple, right?
Wrong. Take a look at Jack Kerouac’s manuscript for On The Road (at left). Is this just one long page?
Well, if you want to get technical, you might say, then, that a page is an arbitrary unit of displayed information. The “page” is, in actuality, a convenience that has been established for you, the reader. Really, it’s a design artifact of the codex, which made its debut in the first century at a time when the scroll was the dominant format for knowledge. Actually, long scrolls were made up of “pages”, ie, individual sheets of paper or whatever material that was used, stitched together, but to my knowledge, there was no definite way of referring to specific pages by number until the bound book came along and replaced the scroll.
Guess what, dear readers? The scroll is back.
That’s right. You’ve probably scrolled (unconsciously) a few times already just to read this. First you fired up your browser and requested a document from the World Wide Web. The problem is your viewport (that is, the viewable area for content in your browser’s window) is somewhere between 800 by 600 pixels and, if you’re lucky, anywhere in the range of 2000 by 1000 pixels. Even so, your monitor is most likely 72 pixels per inch and this means your resolution is low, seeing as a standard printed page is somewhere between 150 and 600 dots per inch (assuming 1 pixel ~= 1 dot). Fewer dots/pixels per inch means fewer words at a legible size per screen. This is why we scroll. We scroll because most documents are longer than can fit in one viewport unit.
When we talk about a “web page” are we simply referring to all of the rendered content in one HTML document? I assume that’s what advertisers refer to when they talk about “pageviews” — how many people have requested the HTML document that has my ad embedded somewhere in it? Again, I question the use of the term “page” here, as others have questioned the relevance of such a measure as the pageview itself. Businesses that lash themselves to arbitrary metrics without doing some honest thinking about what they’re really trying to do and practice “maximizing pageviews” to increase ad inventory deserve to fail in the coming years. Some have even called this practice of pagination evil. In any case, the page is dead, and so is the pageview.
Who killed the static page?
The other truth about “pages” is that new browser technologies are changing the very nature and the characteristics of HTML documents. Actually, the new browser technologies (I’m thinking of Javascript and AJAX in particular) are not new at all; they’re just beginning to be used well on major sites now, which means that the paradigm is shifting from static pages to dynamically drawn, internally refreshing pages. When you request a web “page” from a site like, say, Facebook, you are not just receiving an HTML document, you are downloading a complex set of Javascript code that allow individual components on the page to get and send data back to databases without reloading the entire “page”. (When you change your status message on FB, it updates without refreshing the entire page, which means you just robbed somebody of a “pageview”.) This destroys the old idea of the page as a static document, the basic assumption of on which the Google economy is based.
We now have to move towards thinking of “pages” as “screens” or even something like “views” — not “view” as in “page view” but “view” as in “a view” of something, as in a representation of data. (See Model-View-Controller.) The more sites move towards behaving like actual applications and are focused more on interaction versus mere presentation of content, the more urgent it is that we develop a better vocabulary for talking about what it is we are building.
Tweet This Post
