get in touch

** I am unavailable for freelance work until January 2014 **

If you'd like  to get in touch about a freelance project or just to say hi, please send me a message using the form or via twitter at @ivonnekn.

~ Ivonne

 

 

 


Milton

Designer and illustrator specializing in brand identity design, web design and UI/UX design, based in Toronto via Milton.

Journal

Filtering by Category: Design

Choice Overload in UX

Ivonne Karamoy

Reading Time: 2 mins

I came across this TED talk given by Sheena Iyengar in New York on November 2011 about choice overload. It's a short, eloquent talk about the plethora of choice that we are faced with as consumers in this day in age. Grocery aisles are filled with an overwhelming number of choices for any given product based on brand, flavour, packaging, etc. 

Sheena talks about reducing choice overload for your consumers and how that can have positive effects on your business. She revealed several studies which found that reducing the number of choices has increased sales, profit and productivity.

She offered some strategies for business to apply to help make choosing easier for their customers:

1. Cut - less is more
It is easier to make a decision when there are less choices. 

2. Concretize - make it vivid
It is easier to make a choice when you understand the consequences of each choice and they can be felt in a concrete way.

3. Categorize - more categories, fewer choices
We can handle more categories than we can choices. Categories help people identify the differences between their choices.

4. Condition - presenting low to high choices is more engaging than high to low choices
It's better to provide people with increasing number of choices step-by-step than to start with a large number of choices right off the bat. Starting people off with lower choices allows them to prepare for their decisions and keeps them engaged.

As I listened to her talk, I realized that some of the lessons and takeaways she presented also apply to design...

Less is more. Clearing clutter in your interfaces and in your web design helps to clearly communicate your intent and also helps your users to navigate your interfaces and understand the tasks they need to accomplish.

Every action in the UI should be clearly labeled so that the consequences of each interaction is clear. Or else allow users to revert the interaction and return to a previous state. This makes your users feel safe while navigating your UI and allows each action to be clearly identified.

Do not overwhelm the UI. For complex interfaces, it can be better to divide tasks and present them to the user one at a time or step-by-step instead of all at once. Overwhelming your users is the surest way of losing them.

Guide new users through your UI. Help users familiarize themselves with your UI whenever possible, this can be done through a quick tutorial/callout or by using in place help as needed. Make it easy for users to learn your interface.

 

Seeing (and feeling) is believing

Ivonne Karamoy

When communicating a proof of concept or a design to potential clients seeing (and feeling) is believing.

Sketching ideas and wireframes is a major part of my design process. Sketching allows me to explore and refine ideas. It helps me to narrow my focus and start to understand the requirements and problems that my design needs to address and solve. It's also a great way to communicate your ideas and collaborate with your team - a picture is worth a thousand words.

After the sketching phase I'll usually take my sketches to Balsamiq so that I can start to create my wireframes digitally and make changes easily. I will share these wireframes with the team and we'll use them to discuss features, workflow, and UI design. This process has worked well when we're developing features to our existing product and discussing the project internally. But when we're creating something new and building a concept from scratch it's been helpful to take our wireframes to working prototypes.

A prototype allows us to test ideas internally and refine our assumptions. Most importantly, it allows us to communicate our ideas to clients and get buy in on the interaction design before development begins. We're able to learn about the technical details of our ideas and how that fits with our current product architecture.

Building a prototype is a lot like designing in the browser. But I'm not interested in the visual design. I'm interested in understanding how the UI behaves, the workflow and how the interactions flow from one part to another. Essentially the user experience. This isn't about aesthetics, this is about getting a feel for your interface.

When I build a prototype, I never start blind. That's what the sketches and wireframes are for. Going directly to code alone distract you from the intent of the thing that you're designing and what the goals are for the interface. So I start with my sketches and wireframes and as I build my prototype I discover things that I haven't considered and parts of my workflow that may have been missing. So I can change my decisions right there and test my designs easily.

HTML and CSS are part of my designers toolset and I recommend designers try to use it in theirs to help clients and your team get a feel for your designs. If you have some JavaScript or jQuery knowledge even better but there's frameworks that can help you with that. If you're not the type of designer to design in the browser, I think you'll still find it useful to take your designs to a working prototype and get a feel for the design decisions you made. You can also get some feedback from your team and test your designs on actual users. The prototype doesn't have to be fancy or pretty, and in fact it shouldn't be. Don't focus on the design details, the color, typography, etc. Just focus on the interactions.

You mentioned frameworks?

That's right, there's help! You don't have to start from scratch. That's what front-end frameworks are for...

In one of my recent projects I discovered HTML Kickstart. It's a very lean HTML framework that allows you to build an interactive web interface really quickly. It took me a couple of hours to create a responsive interface with 6 pages. They also use Font Awesome Icons which adds some great UI elements to communicate your interface to  your users.

Other frameworks...

Twitter Bootstrap - This is a popular one and has a whack load of elements that you can use to build your prototype but bootstrap goes beyond prototyping. You can build a full fledged development project with it. You can definitely do a lot more with Bootstrap but HTML Kickstart was ultra lean and light which is why I opted for it. Update: Bootstrap 3 is now out and a lot of it has changed apparently, I haven't tried this version so read more about the changes here.

Foundation - This one I'm excited about. I haven't fully worked with it (just got it setup and tinkered a bit) because again I wanted something really light and quick to use. Foundation is developed on Sass and can work with Compass, both of which I highly recommend, but that was a lot more more setup than I really needed. As a responsive framework I've heard great things and I definitely plan to use it to start my next web design.

 

 

 

 

 

 

Done

Ivonne Karamoy

In art school I learned what I still consider to be a very valuable lesson: know when to stop. I can be an indecisive person and it was extremely difficult for me to stop finicking with my drawings. I learned by practice that sometimes the more I mess with something, the worse it becomes. Every stroke of my charcoal was permanent and I either liked it or I didn't. And if I didn't, I had to keep working it until I liked it again. This allowed for some serendipity but it can also be frustrating. As I continued to do more work I learned to make informed and conscious decisions as I developed a piece. It was a hard process for me at first. I can be a bit of a control freak (maybe more than I'd like to admit) and the thought of making permanent marks without knowing if I would be happy with the result scared the shit out of me. One of my art professors told me in first year, "Don't be afraid to make that mark, don't hesitate. Have conviction in your strokes". It was valuable advice and one that I still try to practice. Art school taught me to not be afraid to put pencil (or charcoal) to paper, that things are never perfect at first and you keep working at it until your gut tells you it's done.

So experience taught me when to stop. The more drawings I did the more I trusted my gut in knowing that was the last stroke, any more and it would be ruined for me. I knew when I was happy with a piece and that if I kept working on it I wouldn't be any happier, in fact I might just be miserable. It's that intuition and awareness that I still take with me in my life and in my work.

Then I started designing for the web.

The web changes, it's constantly evolving and design for the web can change and most probably will change at some point in time. That's true of anything in technology really. It's very different from working with your hands on something tangible like a drawing or a painting. On the web, what's done is done - for now.

For some of us, it's why we like the web. The web itself is changing and a website can change as you or your company evolves. It's exciting but also a bit uncomfortable. I like the freedom of changing things, improving things, but like I said I can be indecisive. And the web enables the indecisive part of me. I think that experience, age and wisdom should make you more decisive and give you more conviction and confidence in yourself and your decisions. So I don't like to humor my indecision. I respect decisiveness because it is so difficult for me. But the web gives me the freedom to change. I can change my mind every year or two. Heck I can redesign my website every month if I wanted to. Of course, it's easy to do this when it's your own personal project. Working on client work is different. You have a set amount of time to finish something and you do your best work in the time you're given and that's that. Sometimes the best indication of done is when your time is up. That I find comforting. So I try to keep my indecision in check and I think that's part of being a designer. You have difficult decisions to make and you have to outweigh the different paths to take and make the most informed decisions with the time you're given and that's it.

Don't get me wrong, I like designing for the web and I've learned to adapt myself to the flow of the web. We're all learning to embrace the changing nature of the web. We've moved beyond the strict guidelines in print design that made it's way to the web. Responsive design reminds us that the web is dynamic and fluid. Agile development tells us to release now and change often. Apps are updated all the time. The websites you've come to love: the facebooks, the twitters, are constantly being redesigned and re-imagined. New apps crop up that make the previous ones from six months ago feel dated. Apps constantly need updating. Devices are updated every year or so. We learn from our audience and we change things. But change can be good or it can be bad. We need to change for the better and that takes a lot of discipline. We need to ask ourselves, will this redesign help our audience and our business? And what helps our business may not help our audience, and vice versa.

As a professional in this field, I'm excited by this evolution. I find it empowering and challenging. As a creative person I find it both freeing and restricting. As a consumer and as a person, I'm exhausted by all this change.

Sometimes I just want something to be done, finished, in all it's shiny glory as a remnant of that particular point in time, never to be touched again.

Sometimes it would be nice to create something and be done.

Managing Change

Ivonne Karamoy

I once heard someone say, "Do something that makes you uncomfortable". I think that being uncomfortable is one of the keys to growing. Life has a way of letting you settle into your normal, your schedule, your happenings. And then wham! something changes and you're forced to react, adjust and settle in again. Change is the one constant in life. And the more we resist it the more difficult it is to accept. I made a career change or rather an adjustment lately. After freelancing full time I decided to take a permanent full-time position working for a company and while also maintaining a part-time freelancing career. Part of the reasoning was personal and part of it was that I think I was ripe for change in my professional life. After designing and illustrating for a few years and enjoying the work that I was doing I wanted to try my hand at something close but somewhat new. I took a position as a UX designer and front-end developer and am working for an organization designing it's online content management system.

I've realized that designing a product and building and improving on that one idea is quite different from designing for games or web projects. It requires a different mentality and approach. Where I would have project stints for one game or website or design project, now I am working through a release cycle in an agile environment on essentially one product. In some ways it can be exciting to know that as your product grows you grow with it and you make changes for your clients and improve on your initial assumptions. On the other hand you don't have that release where you send your work out into the world and set it free. True, game and website development isn't necessarily finished when you release it and you can improve upon it but there is still that big launch when it's completed. In an agile product development cycle, your work is evolving and growing. You have less time to finalize your decisions and have to make compromises for the sake of business objectives or time restraints. It is quite challenging for someone who is comfortable developing a project and refining it before it's released. In terms of production it is a huge change for me and can be quite challenging on it's own without the design challenges that also comes with it.

I'm uncomfortable and nervous and anxious but also excited, hopeful and determined. I'm working in a way that I haven't worked before. In designing game interfaces and websites, you have to think about UX but the types of users you're designing for are different. Designing a software product or service poses different challenges in UX, UI and graphic design. Your audience is different in many ways. The context in which they use your product is different. Their motives are different. The tone takes a more serious turn. Your product must allow them to perform the tasks they need to without too much hassle and also give them some other functionality that they hadn't realized they could use. Your design aesthetic changes a bit as well. Your designs are sometimes based more on business objectives, time constraints and development challenges. It's an uncomfortable position for a designer to be in and though I welcome the challenge it can be frustrating. I do believe that being able to design within these limitations or restrictions is beneficial to growing as a designer. On a personal note it also allows me to enjoy and appreciate my freelance projects more because I have a certain level of artistic freedom and creativity. You can definitely be a bit more playful and have a sense of humour when you design for games or websites (depending on the website). I have counted myself lucky to have had and to continue to have amazing freelance clients who trust me and believe in my work. My full-time gig has given me insight into what it takes to be part of a development group and face the challenges many designers face: defending and arguing for the sake of design. I've never had to fight for design like this but I think I have been in a unique position until now and this experience will only make me a better designer.

Into the world of UX

Ivonne Karamoy

There is a mind shift that needs to happen for a designer to delve into the world of user experience design. Your aesthetic design sense changes because you're thinking not only of the visual design elements but how they work together. You have to care about the overall look and feel but also of the usability of the application and how users will interact with it. UX design often incites many debates about what it means, it's application, the skill sets people should have if they are to label themselves as such, etc. But the point is that user experience design is important and some people find themselves relegated to that position in addition to being a designer, a front-end developer, an interaction designer, etc. Some of us come from a Human Computer Interaction background, a technical development background, a psychology background, a designer background. All of that I think is great because working in technology these days means being able to adapt, acquire and use different skill sets.

For my role as a UX designer and developer, it means that I have a lot of things to think about... How intuitive is it for people to use the product and to navigate it? What does the visual design of the product say to our users? Does the functional design help to achieve the users goals? How well do the interactive pieces fit together from an architectural point of view? Does the design of the interface support and enhance the user workflow and does the application help to support their needs and goals?

Should all of these things be handled by one person? Probably not. Ideally there would be a team. But in some cases, including mine, you work on all aspects at one point or another. The thing I've learned is to try to separate it. I may be in charge of completing the design from start to finish and perhaps even code it but I try to approach them seperately at first. Tackle the workflow, the design, then usability, then the experience... you may cycle back to the workflow and fine tune it again, then critique the experience and the usability and then redesign. Development might happen after the first pass then you redesign it and make changes to the  implementation.

It's a challenging world to work in but can open a designer and developers mind in new and unexpected ways. It also helps to bridge the gap between design and development as we try to create experiences that are effective, effortless and enjoyable.