Software penetrates every pore of human existence. We look up the weather info over the web, giving up on outdoor thermometers. We’re driving to destinations with GPS navigator (forget paper maps with their G7 sections on page 59). We turn on RunKeeper when riding a bike to calculate the average speed and run and boast in Twitter. We’re using software every single day of our lives. It seems we’re hugging our dear gadgets a lot more than our loved ones.
No one knows the exact how-to of writing great software fast, that’s the problem. Waterfall passed away at the crossing of 2 centuries, whereas new software development methodologies (agile) fail at solving the fundamental problems so far. We’re living in very interesting times. Software development industry grows fast right here, right now, and the foundation for a quantitative leap is building up.
How does a great design differ from a good or mediocre design? Often the difference is just in the smallest details. These details shape user experience and greatly affect the way we feel about a product. The product may look great, but people remain cold using it. They don’t feel it is designed for them.
Views functionality in TargetProcess is not a rocket science. There are thousands of applications with views. View is such a boring page to work with usually .
New Views in TargetProcess are crafted with great attention to details. Every single detail is thought out. Every single decision was debated. Let’s dig into details. I will show and explain all of them.
Inline Edit
Inline edit (edit-in-place) is a huge thing. It allows you to edit everything very quickly. These two words are important: everything and quickly. In our new View you can indeed edit everything and do that really quick. But this is not all. Watch these two very short videos.
Inline edit in JIRA
Now compare it with inline edit in TargetProcess
The difference is clear. When you are editing something in JIRA, the effort value jumps back and forth. It is somewhat confusing and unpleasant. Effort in TargetProcess stands stone still as you edit it. This produces a totally different feeling. When everything is still you feel that things are under control. The jumps, on the contrary, are quite distracting, and you feel that something is not good (but often can’t say what exactly).
People assignments
People assignments component has all the small details that make it just awesome. Avatars enable quick recognition. You may think that avatars are not important, but with time you’re so used to them that you identify a person in a split second. Humans recognize image patterns much faster than words. With first and last names only you have to read. With avatars you just scan.
Quick filter is the fastest way to find someone if you have a large development team.
Popular actions are available on the top. Quite often you want to assign work to yourself or un-assign work. It is always a good idea to put popular actions to a visible place.
Moreover, potentially dangerous actions are marked red on mouseover, which secures them from accidental clicks. Also, the red mark builds up quick memory for actions. For Unassign, you will point mouse cursor and click quickly if the button is red without reading.
Links and Actions
There are two types of links: some links represent actions and some links are usual links. There should be a clear distinction between the two types of links, thus action links have a different underline style (dotted):
If you can perform an action (like edit), you miss an opportunity to jump to entity. This problem was resolved by adding a tiny icon. The icon is an idiomatic pattern to navigate away from the current page.
When a property is empty, it is not clear if you can edit it or not. You point cursor to an empty row and think something like “Hmm, is it possible to edit something here?” Then you click, and it appears that it is indeed possible to edit this value. But why make people think? The clear message is shown in an empty row when you move mouse over it:
Hidden Stuff
It is a good idea to show only relevant details. For example, you want to change release or iteration. Releases and iterations have end date, you have many releases and iterations that are already done. Most likely you don’t want to assign a user story to an old release. Thus, old releases are hidden by default.
Mouse over pattern is everywhere. So, all actions are hidden by default. You need to move a mouse cursor over a comment to edit or delete it. Thus interface is clean and not burdened with repeated buttons. There is one disadvantage in this approach: available actions are invisible by default for new users, and they might not be actually aware that they can edit something. But we consider this a good trade-off. We don’t design for new users, we mainly design for people who continuously use our product.
Multi-attach
How often you do you need to upload several files, one by one? It is intolerable in a modern web application. People should be able to upload all the files at once:
Layout
The general layout is pretty straightforward. You have a content area with title, tags, description, attachments and comments on the left, and more details area with miscellaneous information on the right. This separation is logical.
The layout of the area on the right is beautiful. The most important information is on top. For example, status of a user story and its progress. Then you see all assigned people with estimated effort. Everything is lined-up and there are no unclear labels or weird information. Only relevant information is visible. You can also hide information blocks if you want to.
This is it. New views are in beta and more improvements are coming. Stay tuned and give us your feedback. We live by it.
Design Studio is a quite simple and efficient way to run UX meetings. Yesterday we tried it for the first time. There are severalvariations of Design Studio, we made it simple for the first run and set the following rules:
Define problem.
Sketch 5 ideas individually. No more than 5 minutes per idea.
Present and categorize ideas to the team.
Discuss positive and negative sides of the ideas.
Select interesting ideas and create 2 versions for each final final solutions.
We ran Design Studio for the first time to design Email Integration plugin UI. This plugin allows to setup emails integration and define some rules like “bind email to project and create request”. This way TargetProcess retrieves emails and does some interesting things.
Alex, UX designer, is asking some questions.
Sketches categorized by ideas: 1 vertical line = 1 category.
Sticky notes show votes for each idea. 3 ideas have been selected as top ideas.
Hot discussion.
2 most repeated ideas: define email rules via drop downs and via drag and drop
The wall overview
Resulting Sketches
Setup email rules via drop downs
Setup email rules via drag and drop
In general, the meeting went fine. It took about 2 hours to generate, discuss and select ideas. 8 people participated in the meeting, and it seems too many. I think it is much better to have 4-5 people, no more. Also the ideas convergence phase should be improved. Too many people generate too much buzz, so it is harder to make decisions. Anyway, we are going to try Design Studio again and adjust it to our needs.
4 people from TargetProcess attended London UX Conference this year. It was a decent event and here are mine “take-aways”.
UX + Agile
Alan Cooper read a solid visionary lecture about UX future and adoption. The main trend is to mix agile software development practices with user experience teams. There is a new initiative called Balanced Team. He did not spend much time on this topic, but that is something I am curious about. We’ve been adopting UX + Agile at TargetProcess since 2009 and definitely want to do that efficiently.
It was nice to be reassured that we are going in the right direction as a company. We already do many things Alan mentioned in his speech.
Visual Meetings
Our meetings might be better. Sometimes they are too long. Sometimes too boring. Sometimes there is no clear outcome. Quite many workshops and sessions at London UX 2011 were dedicated to better, more productive and more fun meetings. Sunni Brown ran a fantastic workshop: The Art of Graphic facilitation (a.k.a. “How to Run A Workshop with Pictures”). It was very funny and useful. We had several short creative meetings and drew a lot of sketches. I highly recommend her Gamestorming book.
Kate Rutter’s session Design Patterns for Fantabulous Collaborations was very informative and I’ve learned new ways of running efficient meetings, but the practical part was a bit boring and out of context. Overall, after this conference I have a clear understanding how we can improve our meetings which is good. Best Practices for Facilitation looks like a “must read” book, but it seems you can barely purchase it.
We often do ad-hoc meetings, without any preparation. We go like “Let’s discuss this user story with filters”. However, such meetings should be planned. All attendees should be prepared. There should be a right balance of order and chaos. Our meetings are on the chaotic end, so we have a huge space to improve.
Sketching, Sketching, Sketching
Everybody should be able to sketch. It means we should train people to not be afraid to draw something and express information with words AND pictures. Adults often prefer to write and don’t like to draw their thoughts. Mostly because they’re wary of looking ”unprofessional” and “ridiculous”. We should break this prejudice. Sketching is a very powerful technique that allows people to try and express ideas blazingly fast. Bill Buxton wrote an incredible book Sketching User Experience. Read it and you will understand why sketching is so cool.
We like infographics. It is a very good way to represent information. We decided to share some interesting info about our company, development process and the product. Enjoy!
Last week at the mini-conference, one of our guys had no time to do a nice visual wrap-up for his presentation and sufficed with showing portraits of authors while just reading the extracts from their works. The topic was lean basics, and he was talking about Deming and Taylor. While everyone seemed to get bored with listening, as there was no nice visual stuff like we’re all used to now, I suddenly caught myself visualizing the talk of the boss and this worker. The story was about the boss who was convincing the worker to bring 47 tons of iron instead of 12 or something like that.
This got me to thinking that sometimes visualization is doing lip service to us. We’re sitting comfortably, watching TV or watching presentations with nice stylishly UX’ed data, and we are losing the ability to make visualisations with our own brain! The picture is brought to us, so we make no use of the imagination “muscles” and our imagination weakens.
I’m not saying that everyone who watches animated drawings from RSA Animate is doomed. But there always should be a balance between perceiving someone else’s visualizations and creating your own. The power of creative imagination is above everything. No speaker or agile champion, or TV presenter will draw a vision of your business, your product or some function of the software you’re crafting. There’s always a time to look at someone’s visualizations, and time to create your own. Each and every “how-to” about creativity includes this magic word called “vision”. Have you ever thought why any business starts with a vision? It’s exactly for this reason.
There’s a paradox: on the one hand, visual media is everywhere. Lots of visual channels deliver the dish to any, even the laziest perception. The problems is that the legion of those watching produces too few creators.
We’ve got 1 more day left in the year 2010. It’s time for New Year miracles. So let’s devote this day to our creativity, to cleaning the debris of anything we don’t want or need any more, and let’s visualize a
Sketching is not so hard. It is really interesting to sketch something with basic tools. Here is an attempt to sketch a Mind Mapping tool for iPad. It is real fun to sketch for a touch device. In fact, that was our first experience with paper animation and video techniques, but I think the end result is good enough for 6 hours of work (taking into consideration that we’ve learned iMovie on the go).
The application is pretty simple. You can create nodes and connect them, delete and move nodes — all with simple gestures.
The video goes at 2x speed. It is more dynamic this way, but maybe some details are lost…?
There are two important aspects of design process: generative and reductive. We generate a set of alternatives, then we restrict this set based on various criteria. It is impossible to evaluate a solution without its alternatives.
The best way to a good idea is to have lots of ideas — Linus Pauling
I can’t critique just one thing — Richard Sewell
That is one more reason why sketching is so powerful. It helps to generate and evaluate various alternatives. I’ve read in one article that Apple creates a dozen alternative designs for any product. Good enough…
One of the most positive form of criticism is a better idea
Acquiring positive attitude to criticism is a hard change. People don’t like to be criticized in general. You can’t get the correct reaction to criticism out of the box, but should apply every possible effort to make it a part of team’s culture.
People on a design team must be as happy to be wrong as right. If their ideas hold up under strong (but fair) criticism, then great, they can proceed with confidence. If their ideas are rejected with good rationale, then they have learned something. A healthy team is made up of people who have the attitude that it is better to learn something new than to be right
Built to Last
Without appropriate design, yesterday’s success is tomorrow’s failure, since today’s great applications are tomorrow’s legacy systems
Some design decisions live for about 20 years if product is successful. For example, Photoshop has been on the market for 20 years, and some parts of its initial architecture still exist. Can you now imagine how important architectural decisions are? On to entities framework in TargetProcess that was designed 4 years ago. How long will it live? Definitely we did not consider a 20 year time frame back then…
We should assume that technology that is going to have a significant impact over the next 10 years is already 10 years old!
My takeaway lesson is that we should pay more attention to new technologies and think ahead at the same time. This may sound impossible, but it is worth trying.
Learning
Learning is a very important thing. No, I will re-phrase it. Learning is the most important thing in your company. Surprisingly, Bill has given an interesting perspective on learner’s experience levels:
I haven’t seen this concept of levels before, and I like it very much. If we take agile, I am in transition between levels 9 and 10 (I think). In UX, I am between levels 5 and 6. This model is a good guide and may help understand and plan personal or even corporate learning process. Is it possible to apply it to the whole company? Maybe.
Story-telling and Play
A good story is worth thousands of pictures
That one is true. For example, Steve Jobs told 3 stories from his life at Stanford Commencement Speech in 2005. And this speech was remarkable indeed. I remember all the 3 stories, despite the fact that I heard them only once.
Without play imagination dies
and one more:
Stories, and more importantly, story-telling and play, are critical part of design
Ever been on a boring brainstorming session? Fun is an essential part of any creative activity. It should be encouraged, not suppressed.
Design
Finally, some outstanding quotes on design:
Design is a funny word. Some people think design means how it looks. But, of course, if you dig deeper, it’s really how it works. To design something really well, you have to ‘get it.’ You have to really grok [understand] what it’s all about — Steve Jobs
The last thing that you should do when beginning to design an interactive system is write code
The role of design is to find the best design. The role of usability engineering is to help make that design the best.
I purchased this book at UXLX conference in Lisbon. I did not expect too much of it initially. But after several dozen pages it paid off every cent I’d spent and exceeded my expectations in every possible way. This book is for UX designers, yes, but I’d say every executive should read it. There’re so many gems inside.
I can’t resist sharing my takeaway lessons. The ones that impressed me most.
Executive Vision
Everyone knows that Steve Jobs saved Apple after his comeback. But Bill provides a nice and somewhat unexpected perspective on iMac release lessons learned. I highlighted the points that seemed most important to me:
Design saved Apple
The design innovation was done with the existing team
Executive vision was critical to success
Momentum was sustained and rapid (the iMac alone did not save the company, repeated improvements did)
There were failures (hockey-puck shaped mouse [see image], Power Mac G4 Cube [see image])
The failures were key to success (in the long term, safe is far more dangerous than risk)
The design that led to success was largely in the realm of styling, bordering on the superficial
There was almost no interaction between industrial design and user interface design.
This story re-emphasizes the importance of leadership. People haven’t changed, it was the same team, but with the great leader they managed to create a brilliant product. Which impediment have they had until Steve came into the spotlight? Lack of executive vision. If there’s no vision and you don’t care too much about design, failure is the most expected result of a new product release.
Actually, I felt the same about a year ago. That’s why I am paying so much attention to UX: reading books, blogs and articles, visiting conference and, of course, championing UX changes in our company. Bill’s book once again instilled me with passion and with confidence that we are going in the right direction.
“It is important to establish a corporate culture that understands and respects the design plan and objectives…”
New Products
“You can’t milk that cow forever” — this quote relates to old products. Company can’t survive without new products, and here is why.
“As product reaches late maturity, development cost for the next release increases at precisely the same time that the size of the addressable market diminishes.”
This is not the case with TargetProcess so far. Our market is still growing, but development cost indeed gets higher. That is something I don’t like and want to change. There are plenty of technical debts we should pay and features we should remove or re-work to be more simple and consistent. We are already doing that. In several years we should release something new, something different than TargetProcess (frankly, we already have plans for some new products).
Sketches
Sketches are very important for design process. They help to explore alternatives and quickly try them. Without sketches it is really hard to find the best solution. I like sketching and do it often, but Bill provides very good reasons and explanations why and how sketches work.
First, it is interesting to define properties of a sketch:
“Sketches are:
Quick
Timely
Inexpensive
Disposable
Clear vocabulary (style signals that it is a sketch)
Distinct gesture (fluidity that gives sketches openness and freedom)
Minimal detail (“it is usually helpful if the drawing does not show or suggest answers to questions which are not being asked at the time”)
Suggest and explore rather than confirm
Ambiguity (much of their value derives from their being able to be interpreted in different ways, if you need to get the most out of sketch, you need to leave big enough holes)”
Here are the main conclusions I’ve made about sketches:
Ability to quickly generate many ideas. Sketches stimulate imagination and you may invent something initially unexpected. That’s what’s important. I’ve never thought about sketches this way, I always use them as an ideas evaluation technique, but this side effect is brilliant.
Sketches are useful to express ideas. They do not interfere with changing and improving the ideas, since they are not “final”.
Another important thing is that “Sketches are not prototypes”.
I haven’t attended many conferences in my life. To be honest, agile conferences disappointed me. Agile 2009 was half boring, half OK with just one mind-blowing keynote by Jared Spool. As you probably assume, he talked about UX. In fact, this talk has changed many things in TargetProcess, as we started incorporating UX into the company culture. And this is the only reason why I can give Agile 2009 a “good conference” label.
We decided to visit UX LX in Lisbon to check whether there’s any difference. I am an expert in agile, but novice in UX. Conferences are good places to re-charge batteries and to fuel vision. UX LX fully met my expectations. It. Was. Cool.
So what I’ve learned? What we’ll try to apply at TargetProcess soon?
Brainstorming
Maybe this is a number one and Dan Saffer did a really great job at the workshop. To be honest, brainstorming sessions sometimes were boring at TargetProcess. We used several whiteboards and markers. The process was synchronous. It means one person grabs the marker and writes something on the board. Other people throw out ideas and suggestions. Sometimes it works, but there is a much better way.
It is a very good idea to separate two activities. Brainstorming phase may be asynchronous. It means all people can brainstorm the problem and sketch/write results/ideas. There are several techniques that help. One of my favorite is brainwriting. You have a problem and everyone has a sheet of paper. You have 1 minute to write or sketch anything related to the problem. It may be just few words or a very brief sketch. Then you pass the sheet to the next person and receive a similar sheet from the person at the left hand. You see absolutely new content and have 1 minute to understand it and expand it. Very clever and fun.
Photo by Adaptivepath
Also it is very important to engage everyone. Use wall, sticky notes and paper to break down ideas into groups. Then you may review every idea and decide what to do with it. Group interacts with physical objects and these simple activities boost engagement. Also you may give some simple gifts for really cool ideas. It sounds silly, as Dan said, but this works!
Emotions
During one session I understood that TargetProcess is (quite) a boring product. It has almost no emotions inside. It should be more emotional and humanish. Out of the box ideas are:
Use avatars and real people faces
Use better wording in dialogs, navigation, etc.
Make it more personalized
Copywriting
Text is important. It is really, really important. If someone looks for information, finds the page, reads the text and has no clue what that mess of words is all about — that’s really bad. You might have a beautifully designed web site, but if the copy was written by a marketer or developer with poor writing skills — it will not be effective.
Eric Reiss ran fantastic workshop on copywriting and showed how poor wording can literarily kill a product.
Visualization
The truth is that visualization is hard, but if applied well may lead to unexpected boost of satisfaction. There is a lot of data in TargetProcess, but visualization is not so good. Many areas can be improved. We should pay attention to data visualization all the time.
We tried synchronous usability testing on new navigation. It works perfect, but there are less intrusive methods to gather interesting statistic via async usability testing. For example, we can try daily notes or true intent studies. I clearly see how daily notes can be used for installation experience. We just ask a person to install TargetProcess and write everything during this activity (emotions, thoughts, problems). True intent studies may be context-dependent and it is a quick way to gather some interesting data in just a few minutes.
The conference was very good. I feel refreshed and full of new ideas. Also, I feel that in general we are on the right track about User Experience at TargetProcess, but some tactics should be changed.
