Strategy Blog: Viget Labs

Laura Sweltz - User Experience Designer :

 

When I was a kid, I never thought to myself, "Man, when I grow up, I want to be a UX designer … "  I'm not sure that the title even existed then.  Yet, here I am, many years later, working as one at Viget.  The different paths people take before they eventually determine this is the proper field for them are too numerous to count.  While UX designers (or whatever official title is cool this week) come from all different backgrounds and educations, I think there are certain qualities many of them have that lead them down this particular path in the first place.  These are qualities that I see in both myself and my fellow UX designers here at Viget.  If you possess these qualities, you could be a good fit here, too.   

You might make a great UX designer at Viget if …

Continue reading "You Might Make a Great UX Designer At Viget If…"

Josh Korr - Web Project Manager :

I'm in awe of my Viget colleagues, as I am of extraordinarily creative people generally. But I'm especially in awe of my user experience colleagues, and it took me a while to figure out why.

I blame the user experience community for this -- I think UX sells itself short.

Before I came to Viget, user experience seemed to me to be defined by its relationship to visual design and by its deliverables (wireframes, site maps, content inventory, etc.). But user experience at its core is not about visual design, wireframes, or content strategy as ends to themselves. User experience is about defining and designing products.

Continue reading "Reframing UX: It’s About Designing Products"

Kevin Vigneault - User Experience Designer :

One of the things that slightly bugs me about Omnigraffle is that it doesn't have built-in objects for basic HTML form elements that behave like real ones. I would love to have these to add a little more realism to my wireframes and possibly extend them to work inside of a more full-on prototype with "real" forms. So, I recently took a shot at creating some clickable form elements for myself using a combination of Applescript and the custom data feature.

Warning: What I hacked together works, but its not foolproof. I've included some notes below that should help you in using this stencil.

Download the Stencil (Viget.FormElements.gstencil, 156 K)

Checkboxes

• These can be clicked on to toggle between checked and unchecked states.
• The label is stored as "value" within the object's data.
• The state (checked or unchecked) is stored in the object's data and can be keyed off of for further prototyping.

Radio Buttons

• These can be clicked to change the selection in a group of radio buttons.
• The label is stored as "value" within the object's data.
The state (selected or unselected) is stored within each object's data and can be keyed off of for further prototyping.
• They are grouped together as a table, so it's easy to add new rows or columns of radio buttons.
• The unselected radio image is a separate object that needs to live behind the table and can't be grouped with the radio buttons (sorry, it'll break the script).
• To create multiple groups of radio button on the same canvas, you'll need to give each group a unique name. The table has a data item "groupName" currently set to "Fruits". Each object in the table has a data item "group" - also currently set to "Fruits". Both of these need to be changed when another radio group is created.

Drop Downs

• The option that will be displayed when the dropdown is collapsed is stored as "defaultOption" within the object's data. When it's expanded, "allOptions" will be displayed.
• A lot of the styling is contained within the script, so if you want to tweak the styling, I would suggest looking at the script to see how styles are being applied.
• The value that is selected is not passed back to the parent object, so this element is not set up for further prototyping. It is good for showing the list of drop down options without using another layer.

I've also included some buttons and text fields in the stencil. I'm sure there are improvements that can be made to these, so everyone should feel free to use and modify this stencil. If anyone creates something better (especially a dropdown that fully "works"), I'd love to hear about it.

Todd Moy - Senior User Experience Designer :

Divide-the-Dollar is one of my favorite elicitation techniques. If you're not familiar, this technique is used to understand what people value – and in what proportion. Participants in the exercise divide a pool of money (or poker chips, sometimes) among a set of options, making judgments and trade-offs.

The Problem

I don't use Divide-the-Dollar as much as I could. Why?

First and most critically, there are very few online tools that can be used to orchestrate the exercise. Many of our clients and their customers are remote, so we tend to rely on online apps when we can. The main online app that is designed for this purpose – MindCanvas – is expensive and possibly unsupported. While it's possible to build a spreadsheet to manage the logic and capture the data, the experience is rough at best when working with end users.

Second, running onsite tests with a human moderator is expensive and incurs a lot of overhead. Scheduling, dealing with no-shows, and conducting the exercise all eat into budget and schedule. It doesn't scale well and discourages quick, guerrilla-style studies. 

So the problem is technical: the tools aren't there. But on my commute in to work, I realized there was a way to do this if I thought about the problem differently. 

Continue reading "Running Online Divide-the-Dollar Studies using WebSort"

Laura Sweltz - User Experience Designer :

Due to time constraints on a recent project, we decided to skip the formal wireframe process and go from sketching right into design.  We found the process to be quite successful, thanks in large part to the fact that we were working with a savvy client that was willing to actively participate in collaborative sketching.

After a successful kickoff meeting with the client where we gained an understanding of the goals, aims, and content for the site, I took the information that we had gathered, thought about the overall structure of the site, and did some preliminary sketching on my own.  With a site map and some general ideas in mind, I was ready to meet with the client again for our collaborative sketching session.  We reviewed the site map to make sure that it met their needs, completed an exercise to define the unique aspects of various content types, and then I led the main sketching exercise.  We spent half a day working collaboratively to sketch out the various pages together and then later that afternoon, I refined the sketches on my own and posted them for the client to review.  They gave us the go-ahead and design work began.  Since we were collaborating directly with the client, we were able to gather the necessary information, come up with a solution, and get approval from the client in a very short amount of time.

Here are some key points to making a process like this successful:

• Make sure the client understands the process and is willing to participate in collaboration.  This type of process can only be successful if you are working with a client that is comfortable with real-time collaboration and is willing to participate.

• Bring together the right group of people.  Make sure that the key decision makers are in the room.  Also, only include individuals that will be willing to participate.  Any potential blockers should be left out of the session.

• Include the designer in the sketching session.  Including the visual designer in the sketching process is vital.  If they are around when the decisions are made, you won't have to spend an extensive amount of time walking them through the sketches.

• Set realistic expectations for the meeting.  Make sure that all attendees know what needs to be accomplished in the given amount of time.  For example, noting that the group needs to get through pages A, B & C and if there is additional time, that pages D & E can be addressed as well will set realistic expectations and help keep everyone on track.

• Come ready with ideas to jump off the conversation.  Come prepared with ideas to use as jumping off points to get everyone's creative juices flowing.  For example, quickly sketch some very basic options for a page and say "Which path do we want to go down?" and then the group can work on coming up with a fleshed-out version of that page together.

Although this process won't work for all projects, it turned out to be a very successful approach for this one.  If there's a project where it might work for you, I suggest giving it a try!