Pro-Rata 3rd Year Graphic Design Student Intern at Numiko
Many Thanks to Matthew Tweddle and Numiko
During my final year studying Graphic Design at Leeds College of Art I suplimented my academic practice with a pro-rata internship at Numiko. Numiko is a Leeds based, digital design agency who work with a range of clients across nonprofit and broadcast media sectors. At the end of an experimental and fruitful second year at university, it was clear in my mind that digital design was the path I wanted to take within the creavtive industuries. This was affirmed by my experience at Numiko over the summer break between my second and final year. The following publication reveals the influence both acamdemia and professionalism have had on my creative practice. Through a series of articles and projects case studies Iâ€™ve presented the thoughts, ideas and work that have shaped and influence me as a graphic designer over the past year. Thomas Squire Pro-Rata
Pages 06-13 Interview with Jason Santa Maria
Pages 66-75 The universal language of Iconography
Pages 14-21 Device-Agnostic
Pages 76-81 What does it mean to have design style?
Pages 22-23 Try & Try again - Why Prototyping Matters
Pages 82-83 IXD Checklist
Pages 24-27 Bringing design to life
Pages 84-92 Interview with Yaron Schoen
Pages 28-49 Studio Showcase
Page 93 The modern designer
Pages 50-53 Studio Spotlight: Numiko
Pages 94-97 Stoplights Suck: Design and the phyiscal woprld
Pages 54-55 Interview with Matthew Tweedle
Pages 98-99 An invaluable year
Pages 56-65 Finding Design in the Process
-Author The Great Discontent
-Photography Ryan Essmaker
Jason Santa Maria Jason Santa Maria is a Brooklyn-based graphic designer and the founder and principal of the design studio, Mighty. He is currently creative director for Typekit, a faculty member in the MFA Interaction Design program at SVA, co-founder of A Book Apart, creative director for A List Apart, and founder of Typedia. He has worked for clients including AIGA, the Chicago Tribune, Housing Works, Miramax Films, the New York Stock Exchange, PBS, the United Nations, and WordPress.
This guy is awesome and it was our pleasure to meet him in person for dinner, drinks, and of course, an interview. We met at Coco Roco on Smith Street in Brooklyn and grabbed a spot on the back patio. We listened to Jason recount his path into design, which started with an early love of drawing. He also shared about his academic struggles, his discovery of graphic design in college, the moment he realized he could succeed, and why he now feels a responsibility to contribute to the success of others. We were thoroughly inspired by Jason’s generosity in sharing what he’s learned along the way. We left the conversation feeling like anything is possible—and we hope you will, too. Q. Describe your path to becoming a designer. A. It all started when I was a kid. I drew a lot and my parents and grandparents, who my parents and I lived with, were very supportive. They constantly tried to nurture any inherent ability I might have shown for drawing. At the time, I was drawing wilderness scenes; later, I would draw comic books and superheroes. Not only did I like to draw, but as I got older, I thought that perhaps I could do something with it as a career. Since I really liked drawing comics, I figured I would go to school, become an illustrator, go on to draw comic books for a living, and make millions of dollars. I was a very, very poor student and barely managed to get into college. I only applied to one college based on my brother’s recommendation—Kutztown University. It was a good art school and wasn’t very far from where I lived in the suburbs of Philadelphia. They didn’t have a portfolio review, which worked out to my advantage because I didn’t have a portfolio. Instead of a portfolio review, they issued an art test—it was a few steps up from the draw the pirate head and turtle test on TV—and I somehow managed to pass the test and get in. The Illustration program at Kutztown was actually combined with the Graphic Design and Advertising programs in the first two years. All students took foundation courses, like Life Drawing and 2D Design, before taking classes in their concentration. As I worked my way through foundation classes and some illustration courses, I realized that I wasn’t cut out to be an illustrator. I wasn’t nearly as good as others in my classes and I also discovered that my heart wasn’t in it. Around that time, I met more and more people who were concentrating on graphic design, like my friend, Rob Weychert. I liked the work they were doing and began to think graphic design might be a viable option for me,
although it was also very foreign to me because it was done on the computer—up to that point, I had never owned a computer. Q. You had never done any work on a computer? A. No. None whatsoever. My family had a computer, but it was mostly for typing out papers and I didn’t really know how to use it. It certainly wouldn’t have had any design programs on it. It wasn’t until college that I really got acclimated with the computer and later, owned one. That’s amazing. See, it’s never too late. Never. From there, I changed my major and concentrated on graphic design. I still minored in illustration because I couldn’t entirely leave it behind and I realized that many of the skills I learned in illustration courses helped me to be a better designer. I mentioned earlier that academically, I was a poor student in high school. I carried my poor grades from high school over into college. However, after transferring into the Graphic Design program, I suddenly started to become a good student. I got my first “A” and realized, “Oh my god, I can actually do this.” I threw myself into design and developed a deep, deep love for it. I spent all my time reading and trying to make as much work as I could. Toward the end of my college career, an Intro to Web Design course was offered during the summer semester. I happened to already be taking some summer classes, so I took that one, too. That was my introduction to working on the web— before that, the Graphic Design program was entirely print focused. I didn’t know anything about making websites, but that class gave me the opportunity to play and work with this new medium. Being able to make something, put it online, and allow people to view it within minutes was really exciting and interesting to me. That’s my story through the college years. Q. What happened after college? A. I went to college for 4 1/2 years, but completed most of my credits during the first four years. I spent my last semester finishing up a few credits and heavily working on my portfolio so I could start looking for jobs before graduation. I did a couple interviews and was hired at an agency just outside of Philadelphia. I got my foot in the door there because of the print design I had done in school, but
“I want to leave a mark in a way that helps other people to be better and if I have knowledge that can do that, I think I have to share it.” the agency was evenly split between print and web work, which allowed me to continue learning the web. I stayed there for a few years and eventually rose to an art director role. Then I worked at a different agency for a few years and although the people there were fantastic, the experience was unremarkable. Around 2005, I left and started freelancing. While I was freelancing, I started doing work for Jeffrey Zeldman and we really hit it off. We started working together more and I eventually came on board full-time with Happy Cog. I worked remotely from Philly with Jeffrey and then Greg Hoy assembled a group of people and launched the Happy Cog Philadelphia office. During that time, I served as a creative director in both offices for a few years before moving to New York to work more closely with Jeffrey. As one might imagine, I burned out after a few years and when I left Happy Cog, I was unsure if I wanted to keep doing client work at all. It wasn’t the pace or the work itself that got to me—I loved both of those things—but I felt like I was getting too comfortable and complacent creatively. I needed to shake things up, so I decided to try some different non-client things and see if anything stuck. I took a position with a little startup called Typekit, which was run by some friends out in San Francisco—Jeff Veen, Bryan Mason, Ryan Carver, and Greg Veen—and I started working on side projects. I launched Typedia, co-founded A Book Apart, and began teaching in the Interaction Design MFA program at the School of Visual Arts. Q. Did you have a specific “aha” moment when you knew that you wanted to focus on design? A. I would like to say there’s a glamorous answer, but there’s not—it’s more of an embarrassing answer. At the time when I was in school, design was going through a phase where it
was very grungy and deconstructed; those were the days of Ray Gun magazine and heavily used Emigre fonts. I observed what people were doing and noticed how things looked collage-like, thrown together, and dirty. Something about that appealed to me because it was attainable. When you’re starting out, you can’t achieve perfection in your work. There are always really evident seams in what you do, but when it’s supposed to be rough, you can feel like you’re fitting in very quickly. The bar seemed like something I could reach at the time because design was going through this odd phase. Over time, once I started to better understand design, I realized how that style was useful to get me through the door, but not useful as a means to an end for me. That was probably my big “aha” moment. Q. Did you have any mentors along the way? A. One of my biggest mentors, whether she knows it or not, was a college professor of mine named Elaine Cunfer. She was the first teacher who I ever got an “A” from. It was a very simple gesture and I was trying really hard, so I probably earned it. Once I got it, I realized I could succeed and that changed things for me. I began to try harder and engage more with her and my other professors. I also mentioned my friend, Rob Weychert. He would never take credit for this, but he’s the one who really introduced me to design. More than anything, the times I popped by his dorm room and watched over his shoulder while he was working got me thinking about design. And then there’s my grandfather. He built houses and was a fantastic man and craftsman who taught me how to work with my hands and build things. He was very supportive of my crappy drawings when I was a kid and his enthusiasm pushed me forward.
“You just have to put your nose to the grindstone. Sometimes it works and sometimes it doesn’t, but waiting for inspiration to strike isn’t going to bring it about any sooner.”
Q.You already talked about your childhood, but was there anything about it that was especially creative? A. I grew up in the country in Pennsylvania and there was no shortage of things to get into trouble with. What I take away from that is that I was a really imaginative kid. I’m sure that I’m romanticizing it as I’m getting older, but when you’re a kid, everything seems possible. When you think about doing something, the time between thinking about doing it and actually doing it is usually very brief. You say, “Hey, what if I do that?” and then you’re doing it. As an adult, you think, “I want to do this thing,” or, “I want to make something.” Then you start gathering resources and devising a plan, but then you get tired because you’re old and want to lay down. There’s something about that childhood idiocy that I often think back on and love. Why do you think we lose that? You know what injuries feel like when you’re older. You know what emotional injuries feel like and you know what physical injuries feel like. When I was hurtling down a hill on a skateboard as a kid, I didn’t think about the possibility of wiping out and what would happen after that. As you get older, you can very vividly imagine the consequences. I wonder if that’s a good or bad thing. Oh, definitely a good thing. Once you’ve been hurt, you understand what being hurt feels like. It’s good because it makes you more cautious and analytical, which is really valuable. The sum total of big decisions that you need to make as a kid are minimal. Once you are out in the world and in a career or a serious partnership, the decisions you need to make on a daily basis can affect you in big ways. Q. That’s very true. Was there a point in your life when you decided to take a big risk to move forward? A. The biggest risk I took was when I left the security of an agency job and went out on my own. I didn’t know anyone who was doing that at the time and I didn’t know if I could do it. I didn’t know anything about business; I just jumped in with both feet and hoped I would figure it out. I read tons of books and crossed my fingers that nothing bad would happen or that if it did, I could weather the storm. It probably wasn’t until a few years into freelancing that I actually started to feel comfortable with it. How long have you been freelancing? Since 2005, but I’ve done very little freelance work on the side since I started working full-time at Typekit.
Q. Are your family and friends supportive of what you do? A. Oh, yeah! Everyone has been so supportive and is really into it. I hang out with a lot of friends who are designers, so of course they’re supportive. My family has always been into what I do. They don’t always entirely understand it or get what I’m talking about, but they do know that I’m making decent decisions and doing something I love. Q. Do you feel a responsibility to contribute to something bigger than yourself? A. I always have. The default posture of the Internet is that you put work out and hope that someone connects with it, learns from it, and builds upon it. That isn’t unique to the web community, but it’s one of our community’s greatest traits—everyone shares what they do and we all learn from one another.
I like making and continuing to nurture something. The thing that always threw me with client work was that I would propose a solution—sometimes based on experience or sometimes an educated guess—but it might not be the best solution. I made something, gave it to the client, and it became theirs—all the problems became theirs, too. Something about that felt disheartening to me and I often struggled with it. When you are your own client and are able to keep iterating, you can revise something based on the way it’s being used and the feedback you’re receiving. You can improve it and make it the best it can be for as many people as possible. There’s something really wonderful about that; that made me fall in love with design all over again.
From the beginning, whenever I was in a position to tutor or mentor someone, I was always up for it. I want to leave a mark in a way that helps other people to be better and if I have knowledge that can do that, I think I have to share it. By doing so, it sets an example for others to do the same. It pays it forward and helps foster a better community.
I also find myself being more interested in hardware. I’m fascinated by the act of reading and where books might go next. What lives on with the things that we write and how do we get it into people’s hands in a meaningful way? The way we’re doing it now with iPads and Kindles doesn’t feel right. That’s not me lamenting for print books, but I think there should be a larger connection that we’re missing with words beneath glass.
It’s interesting to me that you’re teaching because you talked about struggling academically for the better part of your time as a student. Now you’re able to help others connect with what they’re learning. I’ve never thought about it in that way, but it’s true. Once I figured out how to unlock what’s useful in school, I wanted to do that for other people, too. That’s not to say I’m good at it; I’m an okay teacher. It’s something I want to be good at, but it’s going to take some time.
Q. If you could go back and do one thing differently, do you think you would? A. I don’t know. The good things I’ve done, and even the mistakes I’ve made, have led me to where I am today. If I hadn’t done those things, I might be a different person. I wouldn’t change anything big; I would change some of the little things. For example, when I left my first job, I ended up in a fight with my employer—it was over something stupid and I was just a snotty kid.
Q. Are you satisfied creatively? A. Yes and no. I can say I’m happy with the things I’ve accomplished, but I’m always looking forward to the things yet to come.
Q. If you could give one piece of advice to another designer starting out, what would you say? A. Creativity is like a muscle and you need to exercise it constantly. You need to draw; you need to sketch; you need to constantly be recording and taking in the world around you. A lot of writers say they need to write in order to understand how they think; I believe designers need to draw to understand how they think. Keeping a sketchbook is something that every designer I know takes for granted. Because it’s something they can do, it’s something they don’t do. It’s such a vastly empowering and useful tool to get ideas down on paper and cycle through them quickly. It’s the most useful visual thinking tool that we have at our fingertips.
Q. Are there things that you want to tackle 5 to 10 years down the road? A. One of my greatest fears is being at a big company and rising through the ranks to become a manager of people. That’s an art and there are people who are really good at energizing others and getting the best work out of them, but the thing I most enjoy is being hands-on and seeing something through to the end. I want to keep making things and not just talk about making them.
Q. How does where you live impact your creativity? A. Well, I live in Brooklyn. I know that if you don’t live in New York, it’s very easy to look down on NY and think it’s a hipster place and everyone is really full of themselves. When I moved to NY and fell into Studiomates, it created a family for me, which showed me that everyone here is so kind and so creative. Those people drive me forward. I see what they’re working on and it makes me want to be better and work harder. The people around me are what makes this place so great—it impacts me on a daily basis. It sounds like being a part of a creative community of people is something that’s important to you. Yes. When I first started freelancing, I worked at home by myself and it took a lot of willpower and energy to do regular things—to get out of bed, shower, eat breakfast, and not watch TV or do easy chores around the house all day to feel a sense of accomplishment. Being part of a community in the studio setting and getting out and meeting other designers and artists is important. Here, there is such a density of people with creative pursuits in different disciplines; I may not have been exposed to that otherwise. This is a very enriching place.
Q. Is routine important to the creative process? A. Absolutely. So many writers I know say they get up and no matter what, they write for three hours every morning. They have a regimen and consider art and creative pursuits to be work, which they are. Chuck Close says, “Inspiration is for amateurs; the rest of us just show up and get to work.” You just have to put your nose to the grindstone. Sometimes it works and sometimes it doesn’t, but waiting for inspiration to strike isn’t going to bring it about any sooner. With the way my schedule has been in recent years, I find myself following the momentum of things I’m interested in. I might wake up and know that I have a deadline, but if something really strikes me, I might chase that down because that’s where my interest and energy is at the moment. I’ll probably be able to work through it a lot faster and then I can move on to what I need to do next. Q. That brings us to our next question. What does a typical day look like for you? A. I wouldn’t say there is a typical day. Because I’m involved in a variety of things, whatever is making the most noise at any given time gets my attention. Some days I might work
on Typekit stuff all morning because we’re trying to push out a feature; or I might update the A Book Apart website; or monitor some postings on Typedia; or email back and forth with students or potential clients. And I also travel and speak. Q. You are a busy guy! What are you listening to right now? A. I’m listening to one band way too much right now and I apologize to anyone who follows me on Rdio. My friend, Rob, introduced me to a band called Wussy. They’re from Cincinnati and wow!—I just can’t stop listening to their albums. Q.Any favorite movies or TV shows? A. I’m sure the stock answers are shows like Arrested Development and The Wire, which are really fantastic. My favorite movie is Miller’s Crossing by the Coen brothers; it’s phenomenal. I’m also a really big horror buff and love the classics—Alien, Jaws, The Thing—but I also like lots of campy stuff and everything in between. Q. Favorite book or books? A. I read a great deal of fiction, but I also read a lot about
process and design. There are two books in that category that really affected me and I reread them often. They are Bird by Bird by Anne Lamott— and Hillman Curtis’ book, MTIV: Process, Inspiration and Practice for the New Media Designer. It’s about craft and inspiration and offers a very personal account of Hillman’s process. I read it a few years back when I was still in my formative years as a designer and it changed the way I thought about design. It was very enlightening. Q. What’s your favorite food? A. Probably pizza. New York is a good place to get it because there’s an absurd amount of pizza here. Or my mom’s meatballs. She would leave them cooking on the stove all day and I swear you could hear everyone’s stomachs rumbling throughout the house. I also can’t help but grab a cheesesteak every time I’m back in Philly. Q. What kind of legacy do you hope to leave? A. We all have the opportunity to pay it forward and we’re all part of a greater community. That said, I hope that people learn something from what I did and that because of that, they’re able to help others learn.
-Author Trent Walton
Device-Agnostic The more I build for the web, the more the term â€˜device-agnosticâ€™ endears itself to me.
“Responsive design is not about designing for mobile. But it’s not about designing for the desktop, either. Rather, it’s about adopting a more flexible, deviceagnostic approach to designing for the web.”
desktop to view the full site, finish checking out, or to reset a password. Karen McGrane for A List Apart: It is your mission to get your content out, on whichever platform, in whichever format your audience wants to consume it. Your users get to decide how, when, and where they want to read your content. It is your challenge and your responsibility to deliver a good experience to them. Inconsistent experiences typically manifest themselves as incomplete mobile versions of websites. Sites planned and designed for a desktop-amount of space almost inevitably lead to the painful process of hacking content for smaller screens. If a piece of content doesn’t fit into a mobile experience, what qualifies it for the desktop? A “mobile first” approach to content strategy serves as a solid foundation for content parity, and in turn, happier users. Slow Connection Speeds Slow pages lose users. Designing in an office with 30100mbps connections can skew our perceptions of how most people access the web—impatiently. Consider John Maeda’s Laws of Simplicity: No one likes to suffer the frustration of waiting. Thus all of us, consumers and companies alike, often try to find ways to beat the ticking hand of time. We go out of our way to find the quickest option or any other means to reduce our frustration. When any interaction with products or service providers happens quickly, we attribute this efficiency to the perceived simplicity of experience. Since 2010, the average webpage has almost doubled in size. I agree with Paul Irish’s sentiment that standards and expectations for acceptable performance have become way too lax. Every content and design decision affects performance and speed. I like how Tim Kadlec sees it: With anything added to a page, you need to be able to answer the question of “What value does this provide?” and in turn be able to determine if the value outweighs the pain. I believe the “pain” Tim talks about is the same as the “frustration of waiting” John describes. We can all do better. Thinking of (and testing with) slow connection speeds is the best place to start, carefully considering whether or not each enhancement is worth the weight.
Touch Inputs There is no correlation between screen size and input method. It’s easy to think that touch screens are limited to phones and tablets, but that’s not true. We live in a world where people go around swiping and poking any screen they can get their hands on: ATMs, airport terminals, television sets, and most recently for me, 30” Windows 8 desktop screens. We need to adopt a “fat finger-first” approach to web design. Tappable links often take up more space than clickable ones. Because the need for a touch interface can deeply impact a site’s design (especially when hover states are used for key interactions), it’s easier to make affordances for fat fingers initially rather than retrospectively, especially when detecting touch is near impossible. Device-agnostic sites should address each of these four scenarios by default. Responsive design could be a feature you sprinkle over a website, but RWD is at its best when it is built upon device-agnostic philosophy. A responsive site may have flexible grids, fluid images, and media queries, but if it also scroll-hijacks desktop monitors while stutter-scrolling on touch devices, auto-loads heavy videos that break data plans, or asks users to rotate their screens 90° for the full immersive experience, I’d argue it’s not device-agnostic. Many sites, responsive or not, are built only with ideal scenarios and a small set of devices in mind. I use the term device-agnostic, now synonymous (to me) with good web design, to distinguish those sites that embrace the inherent variability of the web—which, in itself, is nothing new. In 2004, Jeff Veen explained: …I end up delivering solutions to my clients that are far less complex to implement, are much easier to maintain, cost exponentially less to serve, work on multiple browsers and devices, do way better in the search engine lottery, and — of course — are accessible to everyone … everyone … using the Web today. And try to argue with the business value of that. As web designers, it is our role to consider (and plan for) maximum reach and access, even when final results might seem underwhelming or less immersive. I used to think of device-agnostic responsive design as something that would simply make my life as a site builder easier. Now, with over 2.4 billion people in the world online, including many in developing countries, I see it as something that can help make everyone else’s lives better, too.
-Client Design Council
-Author Stacey Mulcahy
Try & Try Again Why Protyping Matters If there ever was a unicorn in the digital agency world, that mythical beast would undeniably be the practice of prototyping. We talk about it, revere it, but for most, we’ve only ever witnessed it vicariously – gracefully crop-dusting the world with rainbows one retro t-shirt at a time. We try on clothes before we buy them and we test drive cars yet, when it comes to interaction, often a series of static images determines the nuances of what we make. We even expect clients to do the same. We all communicate in different ways and often domain knowledge drives our default choices. Strategists deliver decks. Designers make atrocious mimes – describing animation sequences through calculated hand gestures augmented with sound effects. Developers love acronyms like a fat kid loves ice cream. And, if it’s not an Excel document, producers long for project GPS. We spend copious amounts of time trying to communicate effectively, yet frequently ignore one of the best ways to do it. We might not understand what you are trying to say, but we all understand something that we can use and experience. For many, making prototyping an integral part of the project process is painfully new, made only more difficult by how disruptive it is. It forces us to re-evaluate conventional processes and deliverables. Let’s face it – it doesn’t exactly squeeze into the Spanx of line items gracefully like wireframing. Put the word ‘exploratory’ in front of pretty much anything and most people won’t sign up for it. ‘Exploratory’ is too often synonymous with ‘optional’. We’ve come to a point, however, where prototyping is not optional as it is the most effective form of communication in the project process and is too often neither seen nor heard. The intent of prototyping varies as much as the approach. For some, the focus of prototyping is to mitigate risk – creating a proof of concept to discover limitations and prove possibility. For others, it serves to explore possible interaction models. Some people use prototyping-specific software. Just imagine, the modern digital “Inception” experience is actually within reach – there is a plethora of software available to prototype, well, software. Some people use the software that they know and bastardize it for the cause – Keynote comes to mind because no one willingly admits to intimate knowledge of PowerPoint. Others write code, while some embrace their inner organizational-office-supply-stealing self with the flexible lo-fi nature of the yellow Post-It note. Fact is, there is no standard or best practice, there is only the practice that works.
If action speaks louder than words, then prototyping must be doing the death-metal guttural scream right in speculation’s ear. Instead of spending time discussing possibilities, we can spend time actually making something work. The earlier you get to the trying, the better you can inform the design – from font choices and colors to advanced interaction and mental models. Convincing someone – or many people (because plurality makes everything better) – that there is value in a process that may have no defined deliverable is no easy task. It becomes especially daunting when a deliverable or output is how we typically define each project phase. We’ve learned so much from prototyping. People can look at a static design and understand the desired interaction differently. And then, when an actual prototype appears, people can quickly change their minds about previously held notions. Discussions become more focused and valuable because we have the intended context. At Big Spaceship, prototyping is a fundamental part of our approach. From quick, self-contained one-offs to more complex interactions, we’ve embraced the process, elevating it from what many have considered a nicety to a necessity. A prototype’s value is in communicating the intended idea over code reuse and pixel perfection. Each project is different as are its requirements, and these variances mean we don’t adopt one systematic way to do prototyping. In evaluating the needs of the projects, often we find ourselves prototyping to answer questions that we can’t immediately answer. Can we do this? How would this work? These questions often pop up early in the discussion or creative process – so the need to answer them should be just as timely. Is our basket big enough for all those eggs we want to put in it? Often, we find ourselves prototyping what we lovingly refer to as the “sauce” of a project. The sauce is that lil’ something that if it walked by on the street, would make you unabashedly look twice. It’s what gives the experience depth. A lot of time is devoted to “the sauce” through an iterative design process where prototyping is used to explore those nuances we love so much. For example, it’s not uncommon to explore the navigation system subtleties by doing several prototypes iterating on the original idea. Prototyping affords the opportunity for accidental discoveries. Now the pragmatic part of me realizes that there is a deadline, a scope of a work, deliverables and this thing called a schedule. And, more importantly, it all actually exists. Balancing the pragmatic with the utopic requires what I’m told every loving relationship thrives on – compromise. The needs of the project determine the compromise. When a big blue box will suffice in place of the image with a custom-made channel reflection, then why do more? If edge cases don’t have to be accounted for, toss them to the side. If code re-use isn’t important, then there is nothing wrong with programming like no one is watching – just leave the sweatpants in the basement. Prototyping is like that junker of a car you refuse to admit you once owned. It didn’t have to be pretty, it just had to get you from point A to point B and ideally do so without having a random stranger yell at you to replace the muffler. The same goes for prototypes: they are about getting the job done, and the job is to communicate in ways that words and pictures alone cannot.
-Author James De Angelis
-Illustration Thomas Squire
Bringing design to life Why Photoshop vs Sketch doesnâ€™t matter, making things move and live does, and why itâ€™s a great time to be a product designer
The year of the prototype This is the big one: The age of static, lifeless PSD is over. If your designs don’t move, animate, become interactive in some way and tell a story with liveliness, they’re about as impactful as a wet tissue in a boxing match. The past 12 months have introduced amazing tools like Flinto, Framer.js, Marvel app and Xcode’s storyboards and they are letting us do this easier than we ever thought possible. Additionally they afford a crucial step into our process: Allowing us to use the design we’ve created to test for flow issues, learnability, intuitiveness and overall feel. Best of all it lets us to work exponentially better with developers, PMs and clients because they can touch and feel what we’ve designed. If the the best documentation is working software, a good prototype is next. The question that rises from this is which one of these tools to use, and my summary is this: Use all of them. Flinto is brilliant in the nascent stages of your apps when you want to export comps from Photoshop and instantly create an animated flow. You’ll be up and running with something in minutes. Xcode’s Storyboards go one better and allow you to add inputs, labels and interactive views, but comes at the cost of speed (views need to be cut, built and coded to a lesser extent). The bonus is that your prototype will not be thrown away, and can be readied for a developer to begin their work. Framer and Quartz Composer will allow you to create interactions of the highest fidelity but come at the cost of a big learning curve. I use these selectively for focussed, custom interactions that can’t be shown any other way. Interaction design is being pushed to the forefront Ironically the biggest effect of iOS7 on visual design was to de-emphasise it by flattening it out, making it harder to differentiate on aesthetic. This, coupled with the web’s obsession to flatten everything in sight (lest you look as modern as a rotary telephone) has resulted in a spotlight on interactions and UX. Naturally the prototype rises as the champion for designers to create this and is the best tool we have to tell the story of our products.
Static design tools are declining in value This is a macro trend mentioned previously. Photoshop, Sketch, Macaw et al. are simply static tools. In the age of the prototyped (or better yet, shipped) product, the time you spend in these static tools will become less and less important. They are still excellent for concepting and exploring design options (I could never start in the browser), but getting into the browser or the device as early as possible will net the biggest gains. The current trend of new design tools for the web/ device age are all trying to solve the problem of efficiency. But truth be told, Photoshop and Sketch are good enough, and any gains will be small. They’re optimising a very small part of a modern designer’s problems compared to the current epidemic of creating a PSD and calling it a day. In reality this is only about 20% of the total work to be done and learning to build and show interactions will be essential. We’ve learned to be effective we must get real feedback as early as possible (then iterate) which lets us create the most useful sites, web apps and mobile products. We can test our mountain of assumptions and know with some certainty, if the design works or not. Why are we worrying about exporting vectors 5% faster? Ultimately as designer your work will be of the highest standard when you know your materials and their limits, which means knowing how the sausage is made. And the only way to do that is to code, build, and prototype yourself. The expandability of Photoshop Photoshop isn’t dead just yet, 2013 saw an explosion of add-ons to extend and patch its capability and continues to serve digital & product people well. The teams at UI parade, Macrabbit and Piffle have plugged the most common problems around slicing images, asset libraries and getting CSS values for selected objects. For Sketch and other competitors, winning this space will require something 10x better than what we currently have with Photoshop, and even then, will it be worth it considering the learning cost and their declining value?
Designers will learn to love Git It’s a little scary at first — and certainly not the most intuitive process — but version control is here to stay and we can benefit greatly from it. If you make things for the web or devices, even contributing exported assets or other design bits will help greatly in assuring quality and keeping your work up to date. Secondly, using Git allows designers to work with the final product and test (then iterate) states, flows, notifications and other instances of an app that you just can’t do inside of Photoshop. These days installing Rails is simple and learning Git has been thoroughly covered and well taught by online schools like Treehouse and Codeschool. Why not make 2014 the year you try Git? There’s never been a better time to be a Product Designer If 2013 showed anything, it was that design has risen to take its seat at the adult’s table and finally be taken seriously outside of agencies. This is a really huge shift, and probably the biggest thing to happen to digital design in the past decade. There are finally options to do great design outside of client work, and that is incredibly freeing for those who don’t fit into that model. Those who have gone before us have done the heavy lifting of raising design’s profile and are now creating wonderful organisations like Designer Fund and programs like Bridge to help transition designers into this world. The story of good design has also been told through companies like Airbnb, Pinterest, Rdio (and of course, Apple) so that we aren’t wasting nearly as much energy plugging the cause. This cannot be understated how great that is for the wider community of designers. Naturally this has resulted in a rise of design entrepreneurism and has meant that we’re taking the reins and creating businesses from our successful design work rather than being the silent partner behind agencies and monoliths. Another huge gain.
tud Studio Showcase Fantasy Interactive Method Frog Design Studio Mister Hello Monday Athletics Teehan+Lax Huge Inc Area17 Code and Theory
-Studio Fantasy Interactive If you think about it, digital is a daily touchpoint in almost everyone’s lives. And for the most part, we rely on it... crave it, even. And when digital experiences surprise, delight, and simplify life for the end user, it’s a beautiful thing. That’s what Fi is, an agency producing beautiful digital experiences.
A product site that inspires you for Wacom
Pulse for Micosoft
Method are a collaborative design studio who approach design from the needs of the customer, putting them at the heart of the problems they solve and the opportunities they create.
The Wider Image for Reuters
A curated film experience for MUBI
-Studio Frog Design
Frog is a global product strategy and design firm. Who work with businesses to drive innovation, identify opportunities, and design meaningful products and experiences that grow brands and delight customers.
NYC Beacon for New York City State Department
MyFleet for General Electric 37
-Studio Studio Mister
Design and branding for cultural and commercial clients. Producing online, touch and mobile applications. Working in partnership with clients to create compelling, functional design. Ensuring their brand has the impact it deserves. A reputation for delivering innovation and simplicity.
Digital Strategy for RWD 38
Inspiring Journeys for Air New Zealand
-Studio Hello Monday
Hello Monday is a Digital Creative Agency that turn the worst day of the week into the best one. They create joyful digital experiences and unique visual identities that tickle the brain, please the eyes and connect the hearts of brands to the hearts of their consumers.
Sensory Spaces for B&O Play & Mew
Into the arctic for Greenpeace 41
Athletics is a cross-disciplinary creative agency based in New York City, who develop products as well as cultural and commercial experiences at the intersection of design and technology. Founded by a group of designers, technologists, and strategic thinkers in 2004, they take a balanced, medianeutral approach to brand, design and technology challenges.
Punch for Punch 42
Image of a Studio for Herb Lubalin Study Center
Since being founded in 2002, Teehan+Lax has been focusing on designing digital products and services that people use. The majority of this type of work is Web sites. Why? Because that is the most mature and common digital product platform in existence. Increasingly they are asked to design for mobile devices; mobile web and native applications for iOS and Android.
Krush for Krush
Medium for Medium.com
-Studio Huge Inc
Huge create experiences that transform brands, grow businesses and make peopleâ€™s lives better. Creating products and services that transform organizations for the digital economy and building brands and driving sales with a cross-channel, digitally-led approach to communications.
Ted.com for TED
HBO GO for HBO
-Studio Area 17 AREA 17 is an interactive agency. They take an interdisciplinary approach â€” blending the practices of design, technology and branding â€” to create modern interactive systems. They believe the web should be an extension of our daily lives, not a distraction from it.
Canal+ for CanalStreet 49
-Studio Code and Theory
Code and Theory are an exciting interactive agency started in NYC in 2001. They use ideas and technology to bring products and brands to life. They believe in creating products that focus on utility and content.
Finlandia.com for Finlandia Vodka
Los Angeles Times Online for Los Angeles Times
um Numiko Numiko have been working with broadcasters and indies on multiplatform projects since 2002. They help companies develop, pitch, design and build online platforms and experiences to engage audiences and enhance broadcast content.
Make Things Do Stuff for Nominet Trust
Design Council for Design Council
Matthew Tweddle Words from the Head of Design at Numiko
Q. Describe your path to becoming a designer. A. From an early age I took an interest in art and design. At school I studied graphic design, art and media studies before going on to do a New Media International degree at Leeds University and Queensland University of Technology. I practiced lots of different disciplines at University, from screen printing and cell animation through to programming. I found myself focusing on design in my third and fourth year. My final year project won a SH! Award and I was fortunate enough to be in full time employment the day after I completed my degree. Q. Was there a moment when you knew, as a designer that you wanted to focus on web design? A. I’ve always messed about with websites. I started in the late 90’s when I designed and built my band’s first website, complete with a Flash Intro and flaming GIFs. There was a period when I felt somewhat limited by what was possible in a browser but as technology has advanced the web has become one of the most interesting places to design. Q. What is it about web design that inspires you? A. I like that you can put something out there that will be used by hundreds of thousands of people. Anticipating how people will experience your design across a host of different media is an interesting challenge that continues to change as technology continues to evolve. I suppose it is the space where design meets technology that I find most interesting. Q. Has creativity always been part of your life? A. Yes. I have always drawn and created music. I tried to skateboard for around ten years too – they’re all creative outlets in different ways. Q. What is your approach to web design and do you approach every project in the same way or does it depend on the brief? A. It depends on the brief, how much time and budget we have to really get to know the client, the project aims and the audience requirements. Generally though, once I have fully understood the task at hand, I tend to start sketching ideas on paper. I tend to have a concept even if it’s loose on paper before getting in to software. Q. What has been your favourite website by another designer, studio or agency in the past year? A. Reflector, for Arcade Fire by AATOAA. Google Creative Lab
What does a typical day look like for you? As I have moved up through the ranks at Numiko, I have had to become more involved in management and the day to day running of the company. Typically my morning is taken up with emails and catching up with the rest of the design team. On a good afternoon, I still get a concreted stint designing in the afternoon. Have you ever taken any risks to get to where you are today? I think staying in Leeds has been a bit of a risk. It’s kind of bred in to you from your first year of university that you need to be in London. Fortunately we have attracted some great clients at Numiko and I’ve been able to get by with just a couple of commutes to London a month. Is there anything you really want to achieve in the next 5 or 10 years? Next month is my final month at Numiko after a fantastic few years. I am leaving to set up my own studio. I would love a small thriving studio with a great environment and culture, producing ground breaking work that really matters. If you could go back and do one thing differently, do you think you would? It’s a difficult question. I often wonder how things would have panned out had I been put through my paces a little more at a well-known design studio in London or abroad. But, I like the north and I am keen for talent coming out of universities to stay up here! There are still plenty of opportunities in the North, you just have to work a little harder to make the most of them. If you could give one piece of advice to a designer starting out, what would it be? Keep doing personal work and make sure you enjoy it. Favourite album on repeat? My albums/playlists tend to go in cycles depending on what I’m working on. I’ll say ‘The Take Off And Landing Of Everything’ by Elbow. Favourite TV show or Movie? Oh I don’t know. I’m watching Bron/Broen at the moment. Favourite food? I’d like to say something French but I won’t. So Panang curry.
-Author Christopher Butler
Over the past year, weâ€™ve made quite a few changes to how we create websites. Change, of course, is something weâ€™re accustomed to; itâ€™s a necessity to practicing something as subject to technological change as website design for 18 years and counting! But the last year in particular has brought about many adjustments to our process, and each one has only strengthened my conviction that design is as important and central to this business as ever.
Finding Design in the Process
As a result, design has been on my mind constantly, and I’d like to offer you some thoughts about design and process. I’ve been fussing over this for a good while now, and yet I’m still not fully convinced that it’s entirely shipshape. I guess that’s my way of warning you that what lies ahead may be a bit…messy. But we’re talking about design, and design in the real world can only be so clean. So, perhaps messy is appropriate. Knowing Design Design is not a thing…but, there are no things without design. Though design is manifest in many visible, tangible things, design itself is difficult to see. That’s the power of design, but a stumbling block to those who practice it. When success is imperception, the desire to be seen and appreciated will thwart it every time. This is true of all applications of design, but especially so on the web. I’m going to try to show you why. First and foremost, website design is not container design. In this way, it’s strongly differentiated from other applications of design. Let’s look at a printed book as an example. Once an author has written something, the designer’s job is to give that something a physical form. The designer has to consider a variety of issues — everything from typography to the dimensions of the book itself — in an effort to create a container that amplifies its contents. That’s the whole point: a book’s interactivity is one-way. It
delivers information from one mind to another by way of a printed page, which means it must leverage a variety of object interactions and, essentially, make them disappear. A reader who thinks too often about the object in her hands is thinking too little about what it contains. Book designers know this. But they are also aware of the promotional function of their design, which requires the exact opposite kind of thought. A book must convert a prospective reader to a reader. It must seduce, whether it stands out among many on a shelf in a store or a grid of thumbnails on a screen. For this function, its design must do everything but disappear. As information delivery systems, websites obviously share many of the design characteristics of a book. But, there are also major differences to consider. Unlike a book, a website’s content is always in a state of flux. This requires a different approach to design. Whereas a book designer’s task is to give physical form to an already complete, fully realized text, a website’s design must account for an evolving “text,” most of which has not yet been written. This has recursive effects on a website’s form and function. As a colleague recently said to me, “book design reflects content; web design anticipates it.” This would be true of a book, too, if it engaged writers and readers in the same way as a website. It would make for a book that was always getting torn apart and rebound; reordered and re-annotated; getting larger and heavier and messier. The Hulk in a onesie. Not cute. But printed books aren’t like that. They can’t be,
because they are paper and ink and glue and cloth bound together like they mean it. Websites, on the other hand, are “re-printed” every time you call them up on the screen. So, they require a structure that is as elastic as it is invisible. But that elasticity is not just limited to an inside-out growth pattern. Websites also must adapt to their context — from the outside in. That’s what responsive design is all about. Printed books don’t have that, and I’d wager our current understanding of the laws of physics will keep it that way for a good while. And while websites have the same, if not more, promotional considerations as printed books — indeed, some websites exist for marketing purposes alone — they typically require the same design subtlety as their content does. A website, too, must convert — first a prospective reader to a reader, then perhaps a reader to a buyer — and yet, this conversion pattern evolves quickly from an impression to an education. It requires a deeper engagement with content than seduction alone can sustain. But engagement doesn’t just happen. Engagement is the result of an experience designed to capture, hold, and preserve attention, not coincidence or good luck or even GIFs. A book, as we already know, captures attention with its cover. But how it preserves it has just as much to do with its physical properties as the quality of its content. A reader’s ability to focus on a printed book is object-facilitated. From cover to cover, there is only one experience to be had. Distraction must come from elsewhere — from outside the bounds of the book itself. Yet, on the web, any individual piece of content is just one of many blinking marquees, lined up side by side, competing for a user’s attention. Design carries this burden for content and is its only hope of gaining even a few moments of a reader’s time before another tab, text, or tweet becomes of greater interest. This is a subtle art. And really, it’s more of a subtractive process than it is an additive one.
Imagery is seductive; hence, how book covers work. With beautiful images and smart editorial copy, they say to prospective readers, “I’m special. I only do one thing, but I do it in a way that will change your life. I’m really, really worth your time.” Especially today, if a printed book is going to be picked up by a reader at all, it has to have made a successful positive argument for all of those things. But on the web, we’re working against an entropy that we designers have created by going overboard with visual seduction. Our strategy has been all cover and very little content — yes, even those sold on the whole content marketing thing — because we believe that seduction is our only means of getting our tiny page to matter among billions. But let’s face it, nobody is likely to believe that a webpage is truly special, or will change their life, or is worth hours and hours of their time. No, our argument is a negative one: “I won’t waste your time.” If we want people to believe that, we can’t try to seduce them. That’s a surefire way to lose their trust. Instead, we’ve just got to get to the point, as simply as possible. When a designer cannot maintain the balance between seduction and simplicity, design is always degraded. It becomes decoration. Take some time to study your favorite websites. What do you see? The more container you see, the less meaningful content there tends to be. Visual clutter is evidence of a failed search for clarity. It yearns to express design while only making it more inscrutable. Sometimes the best design decision is to put nothing where something could be. We do know this — I really believe that — it’s just a shame we don’t practice it as often as we should. All this is to say, design isn’t so much a property to be seen — literally — as it is to be known and perceived on the basis of other things. Which also means that for designers, knowing design and showing design are two very different things.
“A website’s content is always in a state of flux. This requires a different approach to design which must account for an ever evolving text” 61
Showing Design This is a common enough request; expected, even. The subtext, of course, is, “Show me your best stuff. Assure me that you can create something that will make the right first impression.” There’s a place for this, of course. After all, the value of making a first impression is not to be underestimated. But, at the risk of being pedantic, showing off your most attractive work is not showing design. It’s displaying outcomes. And really, without an explanation of how these outcomes have been reached, a portfolio is merely an index of taste or style. At most, it may enable someone else to discern if there’s chemistry there — a shared sensibility, if you like — but at least, it merely demonstrates that a designer has in fact been allowed to produce some things before. As a vetting method, it’s a profoundly weak one. Good design shapes itself to a variety of factors, least of importance being the designer’s taste or “style.” It’s a custom application of expertise, every time. A gallery of finished work can no more elicit a sound judgement about design or a designer than any other purely visual experience — even getting a look at the designer himself, no matter how captivating his face-touching may be. It may give you plenty to react to — and perhaps in some particular cases that is enough — but images alone cannot create the level of understanding that is intended to be offered by galleries. Design is not just a visual practice,
and so it cannot be expected to operate through optics alone. Design is perceived through use, and understood by communication. In order to truly understand the nature of a designer’s work, you’d really need to discuss it — how that work came about, for whom, and why. Unfortunately, ain’t nobody got time for that. This is why selling “design” doesn’t work. It’s far too vague to make most people feel secure about embarking upon a long and challenging process, especially one that comes with a significant price tag. Talking about design alone is often too abstract, and talking about what design produces is too specific. Goldilocks’ problem. But what about the process by which design expertise is applied, and from which emerge those pretty, shiny outcomes? This is the “just right” you are looking for. Process is something a designer should be able to discuss in a specific, coherent, and concrete way. Process makes people feel safe. It answers their real questions: What’s going to happen? How long will it take? What will I need to do?
Distributing Design The trouble is, articulating a process still requires some way of showing when design is being done. And even that — when design is being done — is something I’m hesitant to say because once we head in the direction of thinking of design as a discrete task, we tend to want to call it something other than design. Like Visual Design, which understandably annoys designers. There is no design phase. Really, design is being done at virtually every point along a website project timeline. But saying that, however true it may be, is only likely to confuse people more. That leaves us with a couple of immediate options, neither of which are great. Option one is to be Willy Wonkaish about it: “It’s all design, Charlie! Every last bit of it.” That’s not going to work. Go back and watch Gene Wilder’s Wonka; he’s so whimsical it’s sinister! The other option is to avoid the all-is-design message and limit our mention of design to only those instances in which we can “show” design in a deliverable. This is the standard approach, the “Design Phase” approach. But design is not a thing to be line-itemed, any more than “creativity” is. There are, obviously, discrete tasks and deliverables that often fall under the category of design, but as long as design is considered just one of many stripes on a Gannt
chart, design — real, effective design — won’t happen. There are a couple of reasons for this. First, isolating design will isolate design expertise. Designers need a place at the early-stage-discussions table, where they can listen and contribute when their ears and eyes are most needed. Believe me, design decisions are being made there. Every design requirement is established by an early-stage decision, which makes every early-stage decision a design decision. Second, if design is isolated, it will just unproductively spill over into everything else anyway — as unnecessary stress over the aesthetic implications of early IA decisions, for example, or legitimate stress over the inevitable usability chaos that results from assuming that design is just putting a layer of shine on. A rule I’ve discerned from experience is that you’re going to talk about design all the time. It just tends to go better when you’re prepared for that.
Amending Design But our tendency is to create workflows that assume uninterrupted, forward momentum. They can be expressed as: Plan → Design → Code When there are setbacks, we treat them as aberrations and go in to all kinds of reactive and unhelpful modes — expectation management mode, quibbling mode, blame mode, CYA mode. We’ve all been there. This is because Plan → Design → Code inevitably leads to Re-plan → Re-design → Re-code. And not just once. No plan is going to be
Instead of moving from production through quality assurance and into a post-production phase once, it’s far more likely that that progression will happen many times — in increasingly smaller increments — before launch. (Although notice how there is a limit to the shortness of these phases. They can only get so small before they’re essentially an ad hoc flow that is nearly impossible to manage, especially if your team is working on more than one project at a time.) In fact, within your production phase are likely multiple
airtight, and so no design or implementation is not going to need to be re-thought a bit once it starts being used. This is what testing is for. The idea that testing and content integration will lead to changes to how things were designed and built shouldn’t be a surprise to anyone. It should really be an expectation. So why don’t we plan accordingly? Well, we kind of do. In the project timeline diagram I created above, there is a post-Q.A. production phase that precedes launch. The idea is that all of those understandable changes would be made then. But let’s look a bit more closely at that. Here at Newfangled, we used to call that the “Tweaks Phase.” I’m not kidding. Let me repeat it in order to emphasize how ridiculous that sounds: “The TWEAKS Phase.” The word tweak is just a bit confusing in this context, isn’t it? Most people use tweak to mean a minor adjustment — a sort of small, benign, no-big-deal kind of thing — which is really quite weird because the original meaning of tweak was more along the lines of a sharp twist or pull. Sounds unpleasant, right? I suppose that’s the irony, because believe me, the “Tweaks Phase” gets unpleasant real quick. Why? Because there is no such thing as a tweak in web development. There are no tweaks. There are only bugs or change orders. Period. Both are expected. The only question is whether the change orders amount to work that should come with an extra charge. (I’m not going to go into that any further here other than to say, sometimes yes, sometimes no.) The real point of tension in this phase tends to be one of timing. Sure, there are going to be changes. But how and how quickly are they going to be done? And was that time and effort something that everyone expected at the outset? If not, tension. So, do yourself a quick favor and banish the word tweak from the design, development, and client services lexicon. Actually, just get rid of it altogether. Permanently. After all, Post-Production not only sounds more professional, it suggests that you actually have a plan for what happens after people start using that thing you made for the first time and now want to change nearly everything about it.
Plan → Design → Code routines. Think, Powers of Ten — the more you zoom in, the more you’re able to see the intrinsic connections between planning, design, and implementation. It’s the DNA of interactive design, the building blocks, its irreducible complexity. It’s far more blended than a simple Gannt chart can visualize accurately, because what is postproduction, really? It’s a multi-step procedure that reacts to what Q.A. reveals, comes up with solutions (Plan + Design), and then implements them (Code). In other words, Plan → Design → Code. Rethinking design once you see it and use it — especially now that the possible contexts are so much more diverse — is inevitable since we’re still learning how we use different devices and interact with information contained by them. For example, we’re not used to “mobile” enough to be good at anticipating the issues that emerge from mobile device use before we implement. This is a bit of a shock to our systems, because we’ve created procedures based upon our years-tested assumption that we know how to design things for screens. So, testing is going to be a big deal, and is certainly going to lead to a pretty involved post-production phase. We need to be in the practice of preparing ourselves and our clients for that and making this workflow part of the roadmap we present at the beginning. We should expect to want something other than our first attempt once we start using it. Endnotes We started with a fairly abstract exploration of how design functions in interactive projects, and then worked our way down, deeper into how design and process work together to make projects happen successfully. In a way, we went from design to project management, didn’t we? I suppose that calls into question just how much the two overlap — how much design in practice is project management, and how much successful project management is the result of design thinking. I suppose I’ll leave that question with you. I’d love to hear what you think!
-Author Thomas Squire
The univseral language of iconography â€œPerfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.â€?
Designing ok icons is easy, designing great icons is a real challenge. To be successful in icon design you have to create or make use of strong visual metaphors, determine the right level of detail to embed within the symbol and also incorporate a visual style or language within the icon. One of the biggest challenges when designing a series of icons is visual consistency. When designing icons a simple visual formula might be applied to develop a range of icons however this may not apply or be adaptable to all the concepts that need to be communicated within the series. A simple way to think about the icon design process is to consider the analogy of a family. A family are similar is many ways they have the same eye colour, hair colour, face or body shape but they are not clones of each other. For example within a series of icons some will be inherently stronger and others will be weaker but their true worth is how they work as series and when used in context - in the same way that a family functions, icons have similarities between each other, therefore making them stronger as a series. A functional icon set should be like a family, they might not look identical but together they look and feel like they belong together. Detail within icons can be tug or war between too much and too little, on one hand detail can be used to communicate a more complex concept however this can also create confusion for user comprehension. Comparatively simple, less detailed icons could lack visual cues which also leaves users confused. How the icon is going to be used can also influence how much detail can be incorporated into the icon. If the icons needs to be used at an extremely small scale there detail should be kept to a minimum whereas if the icons are going to be used on a larger scale there is a greater affordance for more complex details to be incorporated into the symbol. There are two main techniques to designing icons, the iconic technique and the narrative technique both of which have there advantages and disadvantages. The Iconic design technique uses simple and bold shapes to symbolise a concept or reference. This technique only analyses the the simple facts of the message to be communicated. This construction and use of this method is absent of detail and use historical images or symbols users are already familiar with. The symbols using this method are static, simple and bold. The opposing technique to icon creation is, the narrative design technique. These icons are much more complex and detailed and they tell a story visually through the icon and they are often dynamic and reference either an activity or process, these types of icons also visual motion and often us figures to depict activities. When designing icons there are many aesthetic choices which can be considered and exploited to enhance the communication of an icons set however they can also be a hindrance if used incorrectly. It is important to consider from the offset the form in which the series is going to take are the icons going to be constructed using geometry or organic forms? and additionally will the icons be linear or abstract, heavy or light? Repetition of forms or elements within icons can help to establish continuity between icons in a set.
IterationOptas quas volorporpost ratiusam resenihic tem harum ente et alit dolorem oluptates ditaquo te porum aruptas net ommoluptae nem. Et arum, qui omnihitent faci ut quiae. Nam dus, sequas maios dolupta vent faccusanis imin consece raeriat.
Not for Profit
Science & Technology
IterationOptas quas volorporpost ratiusam resenihic tem harum ente et alit dolorem oluptates ditaquo te porum aruptas net ommoluptae nem. Et arum, qui omnihitent faci ut quiae. Nam dus, sequas maios dolupta vent faccusanis imin consece raeriat.
Manufacturing & Retail
Not for profit
Development, Regeneration & Infrastructure
Society, Crime & Law
Science & Technology
Government & Policy
IterationOptas quas volorporpost ratiusam resenihic tem harum ente et alit dolorem oluptates ditaquo te porum aruptas net ommoluptae nem. Et arum, qui omnihitent faci ut quiae. Nam dus, sequas maios dolupta vent faccusanis imin consece raeriat.
-Author Celine Nguyen
What Does It Mean to Have a Design Style?
Beyond the buzzwords: what is design style, and what is its purpose in the design process?
The internet is saturated with information on how to follow different design styles and trends. But missing from most of this discussion is a more rigorous definition of design style, its uses and limitations throughout the design process, and how to approach consistency or variability in style for different design work and contexts. (I’ll primarily be focusing on communication design, with a slant towards technology and software interfaces.) What is design style? In a historical context, we often mean a visual style localized to a time, place, and purpose—Russian constructivism in the 1920’s, grunge in the 90’s. Many styles take the name of the time period (Victorian), aesthetic movement (Art Deco), or design philosophy (Swiss/International style) that spawned them. A style might also be associated with a certain subculture (e.g. urban street art’s spontaneous, constructed letterforms and frequent pop-culture references). In a colloquial context, when we talk about a “design style” it’s usually through buzzwords. Grunge. Swiss. Minimalist. Skeuomorphic. Flat. These words are used to describe a whole set of visual conventions and commonalities. Grunge typography can be overlapping, chaotic,exuberant, and use 10 different typefaces on a single poster. This is in opposition to Swiss typography, which is legible, ordered, reserved, and stark in typography. What does a design style encompass? Superficially speaking, what we recognize as a “design style” is a set of particular colour harmonies, typefaces, compositional styles…But on a higher level, design styles
usually carry with them certain principles of what the goals of design are, and techniques for how to accomplish those goals. Some of these associations are borne out of clichés; others represent a very real part of the philosophy of that style. Skeuomorphism uses gradients and textures because employing physical metaphors is thought to make things clearer and more usable. Flat design is partly a reaction to skeuomorphic design, and employs flat planes of colour to clear away visual confusion and promote clarity. Designers often characterize themselves by a fondness for certain styles and a repulsion to others; their work may clearly show a point of view through a consistent set of patterns and tropes. Products may characterize themselves by having a consistent visual language—Apple’s Human Interface Guidelines for iOS, for example, establish patterns for how menus should look and work, how buttons should be styled, and so on. The purpose of style So what’s the purpose of organizing ideas and patterns into distinct visual styles? This is by no means a comprehensive discussion, but I’ll present some reasons below: Similar principles When you borrow from certain design styles, it might be because the principles of that style agree with the principles of what you’re designing or how you design. For example—
Political posters for Reagan’s 1984 presidential campaign. Using the American flag and White House evokes national imagery and ties Reagan’s image to American icons of power and patriotism; the type is solid and authoritative.
the Swiss International style prioritizes objectivity and readability, so the clean, neutral type might be appropriate for an international, corporate behemoth. Since the style grew out of similar design concerns or issues, the ways in which that style manifests may be the most effective for the situation. Cultural references You might also want to use a style to reference a certain time period and philosophy. Advertising that’s intended to produce nostalgia will often borrow design patterns from past decades. Doing this borrows from our collective culture and aesthetic literacy—whether consciously or subconsciously, we recognize certain visual devices as modern or old-fashioned. Political advertising will attempt to convey authority and reliability through a nationalistic colour scheme or certain icons and symbols; anarchist publications might will tap into a sense of rebellion with haphazard, grungy typesetting. Cosmetics companies that want to tout their eco-friendly, organic products will veer towards allusions to nature—in colour and type and imagery. Specific styles may also be co-opted as a critique or parody of a particular message—themes from WWII-era propaganda posters being used in contemporary design criticizing current military actions or advocating for peace. Uniformity of expression Using a design style to guide the creation of a particular product can help preserve consistency and clarity. Certain visual motifs are often associated with others (certain typefaces may be considered playful, and are expected in conjunction with a youthful and vibrant colour scheme), and knowing what expected conventions exist might help in designing something that has a consistent voice and character. When designing within a system—one book cover in a series, an app for Android or iOS—a design style which dictates common motifs for the system at large helps to show cohesion and interconnectedness. Having consistent design principles and some measure of consistent visual design between all iOS apps, for example, leverages the
existing familiarity and trust users have in the entire iOS interface and app ecosystem, and makes each individual
client—if you allow your personal preferences and habits to overshadow the needs of the project you’re working on and
application a little friendlier and accessible.
the message you need to communicate.
So that’s style. But it’s worth taking a look at not just what a design style is and what it is for, but what it is not—and where a discussion centered around design style may fall short in the design process.
Making aesthetic decisions without context can result in design solutions which are inappropriate for the medium, inappropriate for the voice of the content and speaker, and inappropriate for the information being presented. Style without context When we talk about design, it’s convenient and easy to talk about design styles to express what a design is or what it strives to be. “I want this to be really minimal” might be your way of expressing “I want the content to be front and center, and I don’t want unnecessary visual details to detract from it.” Usually—hopefully—people are translating the names you use to the principles they symbolize.
Style in the design process Designers tend to self-identify as practitioners of particular style, or take great pains to develop an identifiable signature in the work they do. Having some kind of calling card and distinct look isn’t a bad thing—famous designers are often characterized by how they employ type, grids, and colour in highly individualistic ways—but personal style should only go so far in dictating design decisions. The limitations of a personal design style Designer and blogger David Airey recently published an interview with Eric Karjaluoto, the writer of the book The Design Method. When asked, “You say the voice of the designer is irrelevant — what do you mean?”, Karjaluoto responds: I’m speaking specifically about individual personality and style. Design is often considered a close cousin to art, and this misunderstanding clouds what our industry is about. New designers, in particular, want to imbue their work with their own sensibilities, but this desire isn’t actually that important. Clients…need design that is built around their needs and amplifies their organization’s values and aspirations. Designers need to gear themselves to think about their clients’ needs first. Although this specifically references client work, it’s easy to extend this rhetoric to any design work that is intended to reach and communicate with more people than just yourself. A rigid adherence to one “design style” could be a very real threat to the work you produce—whether for yourself or for a
But a verbal shortcut can quickly become a cognitive shortcut, and it’s all too easy to start equating a design style with what it looks like, not what it does. We start treating a design style not as a set of problem-solving techniques, but a coat of paint. Minimal means whitespace, monochrome, sparse visual details. The principles behind minimalism— although critical in determining how appropriate and effective a minimalist style might be—are left behind. When we see style as visual conventions for how things should look, instead of visual solutions, we trivialize design. We have to remember that design is a process, not just an end result—then we can think of different design styles as different means to an end, not recipe books for how we create. Design styles are sets of techniques we can employ, not ideologies that require absolute commitment or loyalty. A great example of the pitfalls of design-style-as-ideology can be found in the skeuomorphic vs. flat design debate. The advent of the chromatically bold and visually adventurous Windows Metro design style, as well as the iOS interface redesign that dispensed with certain skeuomorphic vagaries for a more consistent, “flattened” design, have sparked
considerable discussion on the decline of skeuomorphism and the rise of a flat trend. But it’s also a particularly instructive example of the limitations in how we talk about design style and its use. Skeuomorphism yesterday, flat today Skeuomorphism here refers to the practice of imitating real-life effects and metaphors and a 3D-ish look in digital interface design. It was largely popularized by Apple software interfaces which had ebook reading apps take a very literal approach to the reading interface—you had to literally “flip” digital blocks of text and watch a page animation bring you new content—and calendar apps which mimicked the pebbled-leather bindings of physical desk calendars. The strengths of skeuomorphic design were in employing real-world metaphors to aid usability and familiarity. Buttons that feel 3D clearly state, You can interact with me. I’ll do something. I’ll respond.But the weaknesses of skeuomorphic designs were in introducing those metaphors without a clear intent and purpose. What about a navigational device where you have to “flip” pages of text like a book? Does mimicking a book have a use here? Are the pixels-pretending-to-bepages more effective than just using forward-back arrows? Does that physical metaphor have a place? Flat design has come into vogue largely as a reaction to the excesses and weaknesses of skeuomorphism. It eschews physical metaphors for digital design patterns. So we’ve
moved from leather-and-wood-textured surfaces to flat, bright colours; inset text to dimensionless, straightforward text; physical metaphors to purely digital paradigms. And in the conversation around the large-scale abandonment of skeuomorphism and the adoption of flat design in many, many interfaces, it’s too easy to focus on the what instead of the why. The what—what your buttons should look like, what your menu bars should look like, what your colour palette should look like. These things are straightforward questions with straightforward answers. But the whys complicate things. Why were the skeuomorphic-style buttons ineffective? Why are these flat design paradigms more usable? Why are we dispensing with things that mimic corkboards and notepads for unabashedly digital interfaces? What have we gained in the capabilities of our designed objects? What have we lost? It’s really easy to read design blogs and tech press now and get the sense that skeuomorphism has been entirely disavowed as the old and inefficient way of designing things. But it’s too absolutist to characterize this trend as entirely abandoning one style for another. As software product design drifts away from heavy skeuomorphic metaphors to the visual style and principles of flat design, the core requirements for a well-designed application still hold. A Smashing Magazine article called “Flat And Thin Are In” champions the rise of the “flat trend”, but its discussion on the best practices behind flat design
An example of the Windows 8 flat design style, with large iconography on flat colour.
“Aesthetics are fleeting, the only things with longevity are ideas…Be wary of minimalism as an aesthetic decision without cause.”
end up being best practices for design in general. Focus on content, use grids for order and hierarchy, pay attention to colour and typography. Sound familiar? And even if the visual style of the redesigned iOS 7 interface might signal a departure from skeuomorphism, the principles of employing physical metaphors and effects is still there—in a subtler form. Technology blogger Rene Ritchie has an excellent writeup on the richer interactions and effects in iOS 7, and emphasizes how the physics of small interactions and movements has been beefed up. These are skeuomorphic ideas applied to a different aspect of the interface. Skeuomorphism had—and still has—a purpose. Flat design will also have its strengths and weaknesses as a design style, and figuring out how far to lean in either direction—or which elements to borrow from one or both styles—requires an understanding of design beyond the what. Figure out the requirements for a designed object, and employ a visual style which can most elegantly meet those requirements. Design style is an immensely helpful framework throughout the design process. But the use of style should go beyond hardcoded rules and regulations. Taking a larger view of design style, one that emphasizes pragmatic problem-solving
over trend-driven ideology, leads to a more thoughtful design process—and, hopefully, the creation of more nuanced and effective design. Moving beyond design style In exploring a style, remember that it is one way of seeing the world and the possible design solutions that exist, and not the only way. Be thoughtful, and consider a style not just in terms of how it looks but what it does. Combine motifs from different styles as appropriate. Consider the relative merits of different styles. What purposes can one style serve better than another? What associations does one style promote more clearly? Design is communication. In choosing a visual style, be able to articulate—if only to yourself—why you chose it. Expect your style to evolve and adapt—for the purpose, for shifts in trends and preferences, for different periods of your career and life. Be inventive. Surprise yourself. Surprise others. Let your design be adaptive and reactive to the situation, and your design work address the purpose of the product and the context it inhabits. Investigate different design styles, adopt them, appreciate them, employ them—but in ways which enhance the expressivity and effectiveness of your work.
IXD Checklist By Aaron Legaspi & Amit Jakhu
Affordance Control suggests how to use it
The controls map to the result in a simple and logical way Example: Dropdown arrow is pointing down suggests something will appear below whereas, if an arrow was pointing to the right, it suggests something will appear to the right.
There is a clear metaphor between the control and the real world Example: Button affords push, digitally and physically.
The function of the control is easily determined at a glance Symbolic icons need to be clear for new users Example: Symbolic Icons = an “x” button to indicate close, Iconic Icons = an icon of a “printer” to represent print.
Feedback Should be clear what happened/what is happening
All element states are illustrated clearly and effectively Current state of the system is easily understood by the user. Provide feedback/reinforcement when a task is completed.
Simplicity As simple as possible and task focused
Each step in a sequenced flow is apparent to the user. Example: Amazon’s checkout flow.
Optimize symbols for fastest recognition. Things to consider: Are the icons used ‘iconic’ or ‘symbolic’? If they are symbolic, are they new concepts that need to be learned and if so, does it slow down recognition?
Do not represent multiple actions with similar symbols. Example: Save action with a ‘star’ icon and Like action with a ‘thumbs up’ icon. 84
Structure Content organised sensibly
The depth of the information architecture is consistent throughout the system. Things to consider: Deep information architectures like Flickr versus shallow information architectures like Instagram
Information hierarchy and content structure is organized clearly. Measure length optimizes readability.
Consistency Similarity for predictability
Reduce the need for recall of information by combining symbolism and language. Things to consider: Recall of information is faster when icons and labels are used in conjunction. Refer to Bill Moggridge’s designing with the mind in mind.
Motion and animation patterns are consistent throughout the system. Example: Swipe gesture triggers a page flip in FlipBoard
Leverage existing elements to minimize inconsistency. Example: Styling of cancel button is the same throughout the interface.
Location of the elements are consistent throughout the system. Example: A toolbar is located at the top of every page.
Language use is clear and consistent throughout the system. Symbols should be contextual to the system. Example: Automotive speedometer activity icon in a medical web application.
Language clearly represents corresponding symbol. Example: Trash can icon is labeled “trash” instead of delete.
Tolerance Prevent errors, Helpo recovery
Provide easy reversal of actions. Example: Breadcrumbs, back buttons, swipe gestures.
Users must be able to recognize, diagnose, and recover from errors. Help and support needs to be readily available for the user. 85
-Author The Great Discontent
-Photography Ryan Hefner
Yaron Schoen Yaron is design lead at Twitter NY, co-founder of Float, and founder of Made For Humans. Prior to that, he built websites for companies like National Geographic, Time Warner, Electronic Arts, Travelocity, AOL, and more. He acts like he knows how to write, pretends to know a thing or two about music, and is pretty sure you have no idea how to really pronounce his name. He currently lives in Brooklyn with his amazing wife and gorgeous baby daughter.
Q. Describe your path to becoming a designer. A. Honestly, my path wasn’t a clear one; I didn’t realize I was becoming a web designer until it actually happened. As a kid, I was always into the arts. I was a huge fan of comics and I used to trace, copy, and draw a shit-ton of my favorite superheroes. My walls were covered with drawings I made of my two favorite characters, Wolverine and Batman. Our family also lived close to the Metropolitan Museum of Art when I was young and we went there almost every weekend. I was fascinated by the Greek sculptures, the glass mosaics in the American wing, and the huge, open space in the Egyptian wing. In retrospect, I think I was mostly intrigued by how each section instilled in me a completely different mood by its design, which made me fall in love with interior design. I used to rearrange my room on a monthly basis and my big break came when I was 10 and my mom allowed me to rearrange the living room. I was so fucking excited about that! I loved fitting everything into just the right place and hanging paintings on the wall in the exact, right spot—something about that kind of problem solving made me happy. Growing up, I was surrounded by computers because my dad was a computer scientist and worked in artificial intelligence. I was born in 1979, so I’m not sure which computer we owned, but my guess is that it was a Commodore or an Apple II. In any case, I grew up with old school computers— the ones you had to boot up with a floppy and then hope for the best (laughing). When I was about four years old, I used to boot up J-Bird and Alley Cat every single day to the extent that my mom used to call me “little J-Bird”. I was also a huge fan of the Sierra Quest games. God, I wish they still made games like that—ones where you have to think rather than just shoot the other players to a pulp. When the first Nintendo came out, I was hooked on Mario and Zelda like there was no tomorrow and of course there was also Gameboy and I even had an Atari Lynx! I guess user interfaces and problem solving were already deeply rooted into my brain and that environment felt natural to me—it was the perfect blend of technology, design, and creativity. In the mid-’90s we were living in Israel and I remember the day my dad came home with a laptop. I never used one before and I fell in love immediately. The first thing I started playing with was MS Paint and then my dad told me to check out something cooler than that; it was this new thing called the Internet, where people could connect through servers. I had no idea what he was talking about at the time, but it seemed super cool. I’ve been hooked ever since.
“I think that was a huge part of what lured me into web design—it wasn’t yet well-established and the sky was the limit.”
Is your family from Israel? Yes. My parents were both born in Israel, but lived in the US for 18 years. I was born in Manhattan and at the age of 13, when my parents divorced, my mom and I moved to Israel and my dad stayed in the US for a few more years before he also moved back to Israel. My mom and I lived in Jerusalem and he lived in Tel Aviv.
ActionScript, Flash, HTML, After Effects, and Premiere. CSS wasn’t a well-known thing back then so there was no CSS taught. I figured I would learn all the tools I needed and then decide what I wanted to focus on, but honestly, I’ve learned almost everything I know the hard way—by practice and experience. In essence, I dove into the deep end without really knowing how to swim.
It took a while for me to learn the Hebrew language because I didn’t know it at all. It’s not an easy language to learn and 13 isn’t an easy age to move to a different continent. Because of the language barrier, I didn’t really pay attention to classes in junior high and high school. I was a serious trouble-maker and barely finished high school.
What is it about web design and development that intrigues you? Is it still that a lot of people don’t get it?
After high school, all my friends and I were drafted into the Israeli Army because it’s mandatory—I wasn’t really happy about that. I was a basic guard the first year and in in charge of discipline for the second year—me, in charge of discipline? Who would have thought? Anyway, the law states that you’re supposed to serve three years, but I managed to only do two—I’m not really army material.
What was your path from that first job in Israel to what you’re doing now? It was a series of transitions. I was tired of Israel and politically, it’s stressful there. The whole war thing wasn’t helpful and career-wise, I felt like it was time to move on and I wanted a new challenge. Honestly, I also really missed New York. I applied to a few agencies in NY and Fantasy Interactive, which was the first one I applied to, replied to me right away. They sent me a design test to see if I was the right fit and I had to take it a week before my wife and I got married!
After the army, I wasn’t sure what I wanted to do. My mom encouraged me to go into computers because I was really good with them and I also had that artistic side and interest in illustration. She suggested that I focus on graphics for the computer, so I dabbled with graphic design, but it never really excited me. In 1999, I took a course called Multimedia 101, which was basically a crash course on computer graphics programs. I remember using FreeHand to recreate one of The Beatles’ album covers, dot by dot. It took me a week and I was happy with the results, but the journey was painful and quite boring for me. I just didn’t enjoy it. Technically, my career started in Israel and even though I did take the multimedia courses, I’m pretty much self-taught. My first job was at a small web agency in Jerusalem. While I was there, we also created a content management system and an email newsletter service à la MailChimp, which didn’t yet exist over there. It was hard to sell or explain what we were doing because people didn’t really get it. I liked that. I think that was a huge part of what lured me into web design—it wasn’t yet well-established and the sky was the limit. Did you then continue to teach yourself as you went along? Yeah. The classes that I took in the Multimedia 101 course were Photoshop, FreeHand, Dreamweaver, Director, Lingo,
I think that was the main thing for me, especially when I started. I guess that when everyone “gets it”, my job is done (laughing).
Did you meet your wife in Israel? No, I actually met my wife in the deserts of Sinai in Egypt— that’s a whole different story. There are a lot of Bedouin tribes who have huts scattered loosely on the beaches of the Sinai peninsula. People go there for off the grid vacations. It’s a lovely spot and there’s no electricity—only sand, beaches, and seafood, which is caught and served on the spot. I met my wife there. Anyway, I took that design test for Fantasy Interactive, passed, and got the job. My wife and I got married a week later and we had to move right away. The problem was that my wife wasn’t an American citizen, so she needed a visa to enter the States. So, we had just gotten married and I had to fly to New York, start a new job, and find an apartment while my new wife stayed behind for two months waiting for her visa. It wasn’t the best way to start a marriage, but we hustled through it and everything turned out perfect! I started the job at Fantasy Interactive and all of a sudden, I was working for a world-class agency and building sites for big names like National Geographic and Time Warner.
“I might become satisfied in one creative discipline, but that would only lead me to dive into a totally new and different discipline. Who knows? Creativity might strike in a place I least expect.”
It was fulfilling and I was there for two wonderful years, but then I decided I wanted to work on a product. I had the opportunity to do that there with Kontain, but agency life was too stressful for me. It was a lot of the same thing over and over—get a brief from a client, build the website, ship it, never see it again, repeat. There wasn’t a lot of ownership. It was like caring for a baby and then finally, when she learns to walk, she walks straight out the door and never comes back. I wanted her to come back.
I became a consultant for the company and helped with product related stuff. About a year or so after Julpan was formed, it was acquired by Twitter. I remember the timing of it because we got acquired two weeks before my daughter was born and I had to fly out to San Francisco for the acquisition while I knew that at any minute, my daughter might pop out! Thankfully she didn’t arrive while I was gone. She’s nine months old now, which is about the same amount of time I’ve been working at Twitter.
I then accepted an offer to join AOL and worked there for about eight months. It was too corporate for me. At some point, the company had to fire a large number of employees and they were offering a really nice buyout for those who opted to quit on their own. I had already decided I wanted to leave and had been preparing my portfolio and blogging, so I took the severance package, which gave me a cushion to start freelancing. I freelanced for a year or two, started my own company called Made for Humans, and also worked on some side projects.
Q. Was creativity a part of your childhood? A. Definitely.
At that time, I was also consulting for a start-up called Julpan, which was founded by a good friend of mine, Ori Allon. I met Ori in the jungles of Guatemala while climbing the Aztec pyramids—another crazy story. After coming back to civilization, we kept in touch and a few years later, he gathered a team of really talented engineers and created Julpan, which is the Aboriginal name for the star formation of Orion. Since I had been involved from the beginning,
Q. Do you have any fun stories you want to share? A. Well, my mom always goes on and on about the fact that I made this amazing drawing of a car when I was two. I think everyone has some sort of creative bone when they’re young, but I was really into the arts, perhaps more so than the average kid. I drew and painted a ton. I was in love with buildings and drew the cityscapes I could see from the view of our Upper East Side apartment—I could actually see the Twin Towers from our window. I was also a fan of Bob Ross and used to paint imaginary landscapes with trees and mountains while I watched his show. Q. Did you have any “aha” moments along the way when you knew you wanted to focus more on web? A. Yeah. If I try to pinpoint my “aha” moment for the web, I think it was really the first time I took a text file and
“One of the best pieces of advice I can give to a designer is to be welltraveled. Design is really about people; the more you understand humans, the better you will be as a designer.”
translated it into something visual on a browser using tables and colors. It was awesome. But really, I continue to have “aha” moments with what I’m doing all the time. If I stop having them, I’m probably going to go do something else. Q. Did you have any mentors along the way? A. No, I didn’t. That’s the sad truth. When I started my career in Israel, I was self-taught and not a lot of people were into web design. That was when I needed a mentor the most; obviously you can always have a mentor, but it’s most helpful when you’re starting out. I guess my boss at my first job was kind of like a mentor. He had established his web design company in Israel in 1999 or 2000, which was unheard of. I really admired his cojones to create this thing that not a lot of people understood. But when it comes to an actual design mentor, I don’t know. Perhaps the creative director at Fantasy Interactive was a mentor in the sense that he instilled pixel perfection into me. I guess I would say I’ve had role models, but not necessarily mentors. Q. Have you had to take any risks along the way in order to move forward? A. Technically everything is a fucking risk, but career-wise, I’ve taken many. The biggest and most impactful risk was right after I finished my Multimedia course over in Israel. The human resources group at the school assisted students in finding jobs once they completed coursework and I decided to sign up for work to see what would happen. I wasn’t really expecting anything to happen and so, instead of waiting for
some sort of reply from them, I decided to buy a ticket to India and go backpacking alone for a few months. I figured that would be the time to go because I wouldn’t have another chance once I started a career. In reality, it took me a month or so to actually get the courage to buy the ticket. Of course, the same day I bought the ticket, the school called to say they had a job for me—it couldn’t have been more poetic. I went to meet my potential employer and the team. They were great; the office was great. But it was a tough decision. I knew that if I didn’t go on the trip to India, I might not have another opportunity to go—I wasn’t yet invested in a job or relationship or anything that would tie me down. But if I went to India, I would come back rusty and everything I just learned would be wasted. I also didn’t know if I would be able to find such a cool job opportunity again. I chose the job and never flew to India. That might have been the biggest risk I took. In retrospect, I don’t regret that decision, but I would have loved to backpack throughout India. I’m not sure when I’ll have the chance to do that again. One of the best pieces of advice I can give to a designer is to be well-traveled. Design is really about people; the more you understand humans, the better you will be as a designer. There’s no better way to understand humans than to travel, especially alone. That throws you into situations where human interaction is everything.
Q. On a personal level, do you feel a responsibility to contribute to something bigger than yourself? A. Yeah, totally. I did a lot of work with charity: water and I contribute to them as much as I can. It’s cliche, but the web has so much potential. There are a lot of real life problems we could be solving by using the web as a tool. It’s such an exciting time to be working in this industry and I try not to forget that or take it for granted. The only way I technically give back is through work I do with charity: water, but I would love to do more. I’m not sure what or how. I’d obviously love to have more time to do that and stop falling into the “busy trap”. Q. You write pretty regularly on your blog, which I appreciate because it’s not always design related. Do you see that as a way to give back? A. Thanks! Not really. Honestly, I primarily write for myself as a creative outlet and if people enjoy what I write, then that’s an added bonus. It’s humbling if people find it to be helpful, but that is never the goal. I’m not necessarily as good at explaining technicalities or design processes or providing insights into my techniques as other talented folks are—I admire folks who are good at that. So when I write, I try to focus more on the theoretical, bird’s eye view of things. Lately I’ve tried not to focus too much on design; I’d rather tell stories and insert design themes into them. Q. Are your family and friends supportive of what you do? Who has encouraged you the most along your creative path? A. I was fortunate to have support. When I started my career in Israel, my biggest supporters were my mom and dad. Even though my mom didn’t understand what web design really was, she was the one who initially pushed me to do it because she had a sense that I would be good at it. Obviously, my wife is a huge support for me and she was technically my business partner in Made for Humans. And my daughter has no choice but to be supportive—she’s stuck with me (laughing). I guess I would say that the women in my life—my wife and mom—are my biggest supporters. Q. Are you satisfied creatively? A. Absolutely not. I don’t think I will ever be satisfied creatively. I came into the design world from more of an artistic angle, so design alone doesn’t satisfy me. That is why I write; why I used to illustrate each of my blog posts; and why I have a music section on my site. I might become satisfied in one creative discipline, but that would only lead me to dive into a totally new and different discipline. Who
knows? Creativity might strike in a place I least expect. I might find creative satisfaction in cooking or gardening or even in raising my child. All I know is that I’m extremely hungry for more. Q. Where do you see yourself in 5 to 10 years? A. You know that scene in The Godfather when Vito dies in his garden? I’d like to have that garden and tend it, play in it with my kids, have no worries, and drink wine and eat great food. Seriously though, I really have no idea. I was never much of a planner and most of the time I just plan for the near future and let life take its course. I hope to have more artistic outlets; I’d love to compose and release an album; I’d like to learn a new trade, maybe something manual that has nothing to do with computers. I do hope to be better at stopping, slowing my pace, and enjoying the small moments in life—they usually fly by too quickly. The past decade has flown by and I want to take my time in this next one so that I can grasp what’s happening and enjoy myself more. Q. If you could give one piece of advice to another designer starting out, what would you say? You already mentioned travel. Is there anything else? A. Don’t be scared of failing. If you’re scared of failing, you won’t try new things. I’ve noticed that when I sketch out an idea, I tend to get it right on about the fifth try. If I’m scared to keep on trying, I’ll never release anything worthwhile There’s no art to it; you learn from your failures and it’s a pragmatic process. It’s about trial and error and learning from your mistakes. To me, that’s one of the differences between art and design. In art, generally speaking, something flows out and you don’t necessarily care what the consequences are, whereas in design, it may or may not flow out, but you care about the consequences. If you fail in those consequences, you need to be ready to iterate. In design, people have to be able to interpret what you’re trying to communicate and with art, it’s open to interpretation. It doesn’t matter. Exactly. Q. How does where you live impact your creativity? A. Immensely. Environment does affect my creativity; I don’t know exactly how, but I know that it does. New York has always been my muse. When I was young, we lived next to Central Park and maybe this is connected to my childhood because my grade school was there, but my favorite place in Manhattan is Central Park West. I love that street; I always feel at home there and my soul fills up with a ton of energy
“Creativity is about muses, whether it’s your environment or the people around you. You need to input in order to output; you won’t output anything if you’re in a vacuum.” and inspiration just from being there. Actually, now that I’m in Brooklyn—this is not popular to say—I feel like I’m in exile. I’m a Manhattanite; I always was and always will be. There are a lot of great and talented people in Brooklyn, but when it comes to the city and the vibe and architecture and landscape, I belong on the island—that’s where I get filled with creative energy. I was in Paris a few months ago and that’s a good example of an environment affecting my creativity. When it comes to architecture, Paris is the most beautiful place in the world in my opinion. It’s so extravagant and everything is perfectly symmetric. I’m a huge symmetry geek and when I came back, I noticed that I had an urge to design symmetrically and center align everything! So yeah, I think environment does heavily influence me. Q. Is it important to you to be part of a creative community of people? A. Yes, it’s extremely important. It doesn’t have to be a design community; it can be any kind of creative community. I have a lot of friends who are musicians and being around music inspires me. I’m actually a huge music geek, but unfortunately I never learned to play a traditional instrument. I do write and mix electronic music in my nonexistent spare time. Creativity is about muses, whether it’s your environment or the people around you. You need to input in order to output; you won’t output anything if you’re in a vacuum. Throughout history, groups of talented people fed off each other and in the process, they created movements of similar work. That’s been the case with music, art, and design all
along. It’s just the way it works and it’s beautiful. That’s why it seems weird to me when folks complain about people copying them. To me, that’s a load of bullshit; it’s completely natural and legit to get inspired by your community. It’s not copying when you’re inspired by someone and you take their work and interpret it as your own. That’s what a creative community does and I believe we need to be more open to that. You may have already created a really good solution for something I’m working on and sure, I might use your solution. Who cares? I don’t care if I see websites that look heavily inspired by my work. If you can do it better or if you are just inspired to do the same thing, I say go for it! Fuck—if your version is better than mine, I might be the one who needs to rethink my version if my goal is to differentiate myself. A creative community is supposed to inspire each other in that way. It’s healthy and I don’t think it should be viewed in a negative light. Q. What does a typical day look like for you? A. It used to be all about the parties, hookers, and blow, but now I have a baby, so…just kidding. I’d like to say I wake up at 5:30am with my wife and baby daughter because I’m a model father, but I don’t. I stumble out of bed by 6:30–7am at the latest, which is still insanely early for me—that never would have happened pre-baby. Then I brush my teeth, take a shower, go to the living room, and my wife and daughter are waiting there for me. We have a long hallway in our apartment, so when I walk toward my daughter, who is on her play mat in the living room, she gets all excited and claps and smiles—that’s the best part of my day (laughing). I take over baby duties for my wife and spend time with my daughter while my wife does her thing. I leave home around 8:30–9am and get to work at about 9:30–10am.
“…I continue to have ‘aha’ moments with what I’m doing all the time. If I stop having them, I’m probably going to go do something else.” I work at Twitter and am design lead at the NY office. I have a full day’s work with the best design team in the world and then I come home, hopefully in time for the sleep ritual that my wife and I have with our daughter. We give her a bath, read her a story, and then put her to bed. Then I clean some dishes, make some food, spend time with my wife, and fall asleep at 9pm. A good night is 11pm—that’s living dangerously for us. Q. Current album on repeat? A. I listen to so much shit all day. Abbey Road is always on repeat. Lately I’ve been listening to a lot of house music— Nick Warren and Sasha. I also like Tom Waits’ Rain Dogs; anything by Beastie Boys, Chet Baker, or Radiohead; and Late Night Tales by Fatboy Slim. Q. Any favorite TV shows or movies? A. I like So You Think You Can Dance. I like sleaze or reality TV. It’s hard for me to focus on a series from week to week and I don’t have time to just download it and watch it. I try to watch stuff that doesn’t really have a plot so that I can just zone out. There can’t be a story arc through the series if I’m going to watch it. I’d rather not take it on because I won’t complete it. I do like Seinfeld though. My default favorite movie is 2001: A Space Odyssey. I guess I like Kubrick because another favorite is The Shining. I also like Mulholland Drive. Man, they’re all psychological thrillers. So I don’t look like I’m fucked up, The Golden Child with Eddie Murphy and The Breakfast Club are also favorites.
Q. Favorite book? A. I’m not sure I can pinpoint a favorite, but a few that come to mind are A Journey to the Center of the Earth, The Hitchhiker’s Guide To The Galaxy series, and Pale Blue Dot. Man, this is gonna sound lame, but I’ve had a serious drought when it comes to books in recent years. Since I don’t have a lot of time to read and finish books, I choose to read things I can quickly finish. I read more articles than I do books, which I’m trying to change. I recently read the Steve Jobs book, which is a nice transition into reading books again because it’s kind of work-related and it was a quick, easy read. Now I’m reading Kitchen Confidential by Anthony Bourdain, which I’m in love with. Q. What kind of legacy do you hope to leave? A. Fuck! I have no clue how to even approach that question. I guess it depends; I can answer it in different ways. If you ask my ego, I’d want my legacy to be that of a person who created amazing experiences that affected the lives of millions. If you ask my soul, I’d want to be known as a person who created things from the heart and never gave a shit about what other people thought. If you ask my heart, I’d want to provide the best possible lives filled with joy and happiness for my wife and daughter. If you ask my conscience, then it’s all about charity and giving back to the community through philanthropy and helping to better the world. People are complex animals and have so many different sides to them. For me, there’s no right answer. It’s a little bit
The Modern Designer a) Be curious, courageous, creative, resourceful, problem solvers. Every designer needs to have a solid understanding of the fundamentals. Concepting, color theory, typography, layout, hierarchies, Piet Mondrian, pixel perfection. All of it. We should also be able to design within boundaries. In school a typical assignment could take any direction and had no budget limitations. Designing in the real world comes with many parameters, and innovation within established systems is a cherished skill. b) Have a user experience mindset, and design for interaction. I don’t just mean digital or web design. This involves creating usable communications that work as a customer interacts with any and all touch points. The messaging on your print ad needs to be work not only in print, but online, in video, at events, anywhere a customer may see it. c) Have an understanding of marketing and business in general, to be able to put some strategy behind communications and impact business development. Imagine being asked to design a landing page that acts as a minimum viable product to try to establish product/market fit? Or to create ads that can be split-tested against each other to minimize cost per lead? Some business and marketing acumen would serve you well in situations like this. d) Embrace Agile project management methodologies. Liquid Agency did a fantastic write up speaking to this — modern designers need to not only manage their (multiple) projects, but they have to be able to pivot and create new iterations on a dime. It takes a lot of transparency with the client, a dash of humility, and is not for the faint of heart, but it allows you to create better, faster. 95
-Author Brady Voss
Stoplights Suck: Design and the physical world
Just before the culmination of that limitless and intoxicating dream you’re having, you’re rudely awakened by the obnoxious sounds of your alarm clock. Your eyelids weighing like a ton of bricks, muscles lacking all adrenaline. One can’t even imagine what the actual temperature of the air above feels like, as you languidly pull your body out of the bed it’s sunk so deeply into. That seems as if it’s an accomplishment within itself. You pound down your morning cup of coffee, so quickly nowadays that it’s without even realizing it actually has taste anymore. But this daily routine and habit pulls you free of any feeling of lethargy.
As you ready yourself for a productive day, you get into your car, and within a few seconds you’re shifting into drive and going five over the posted speed limit. You soon find yourself daydreaming of what the day will bring. Your mind starts with logical conversations with coworkers, ideas you might consider poking at, but before you know it, you are subconsciously fast-forwarding and rewinding through unrealistic scenarios where you achieve the unthinkable. Then click, you snap back to reality and you’re dead still sitting at a stoplight. That red light is just beaming at you as if it is laughing in your face, knowing that if you choose to disobey, it’s your wallet that suffers. Even if you had that urge, you couldn’t anyways because you’re surrounded by nothing but impervious surfaces. But hey, it’s a stoplight and they are everywhere. That’s just life and you’ve learned to live with them. Traffic on one side of the intersection starts progressing. They stop, then the next side starts. Every time you see a change in movement, cars around you inch forward as if they are getting a head start to win the Human Race. After what seems like five Billboard Top 40 songs have played, it’s your turn. It finally turns to that trusting, encouraging primary color of light: green. You’re now optimistic that the day will continue. The person up front doesn’t move. Unaware of the presence of the glowing emerald green light, the three seconds of hesitation cause the anxiousness and fury inside people to instantly show. Horns sporadically honk, while one angry citizen holds on his, literally until the car in hiatus sputters out of sight. You’re only four cars away from safely assuming you can pass through and carry on with your life. Two cars get through, then yellow happens. The third zips through as if his life depended on it. You have to stop. For one agitated moment, you feel how simple it could have been and how quickly you could have just pushed through and moved on. But how could one additional car not have gone through! Back to square one. There have been minor attempts to address some of these issues, but they are typically just patches on existing methods with expensive, ugly, and not-so-elegant solutions. By the time a city designs, paves, landscapes, and finishes a road or intersection, millions of dollars are spent. Then, two years later, they look to modify the existing design because there was little thought put into the original. They then dig huge holes in the asphalt to install detectors, then re-pave it again. That way, the system can detect when a car is waiting to proceed. For instance, if I am driving at 55 MPH down the road and am soon approaching the intersection, and another
car inches up to the intersection to cross my path. It detects that other car, tells me to brake from 55 to 0 MPH to let him cross, then it gives me the green to go ahead and continue. So in all, this solution reduced the other car’s waiting time, but created a waiting time for me–which in turn costs more money in gas waiting and accelerating, and affected all the cars behind me as well. Times that by millions, and you can see how a poorly designed solution affects life. But don’t accept that. Just because something is poorly designed and millions of people use it, doesn’t mean it has to stay that way. Go do it better. Think about where the current version fails and capitalize on those aspects. This is exactly why there is competition in business today. If all products and people were the same, this world would be a boring place. In the end, if what you’ve created is a practical and elegant solution to the existing problem, over time it will speak for itself through numbers. As a Product Designer at Facebook, I love to use the example of Instagram. A wonderfully fantastic product that puts even more emotion into already emotional content: photos. When it was first created, its primary focus wasn’t to have the most visually appealing and award-winning design. It was to let people accomplish the task of adding stunning filters to their photos and share them with the world. It was that ability which made people grab it by the masses. If it were the most beautiful product in the App Store, but it was difficult to add filters to photos, it would have instantly failed. It was given the architecture and capabilities to do what it does, then refined over time to pixel-perfection. Not everyone is a Designer, nor does everyone think the way we do. That is what makes us special. We can relate. We have empathy. We know efficiency. The only time we don’t show the most efficient manner of accomplishing a task is when someone else higher up the food chain tells us differently. Our lives revolve around our screens, sucking us into social networks full of beautiful connections and conversation, games that challenge us with every move, and day-to-day activities that help us do our jobs better. We can’t forget that our expertise extends much further beyond what people hold excitedly in their hands. Like reading a good book, thinking outside of the norm will challenge and stimulate your mind to make you better at what you do. Every time I sit at a stoplight, I instantly start brainstorming all of the endless possibilities of what the interaction and experience could be for that ever-so-present, tangible, yet wasteful part of our lives. There was a need to solve the problem of two objects crossing paths simultaneously.
The solution was probably the most affordable method at the time that was continuously adopted without a second thought. Now, the world revolves around that experience billions of times per day. That experience consists of 80% of the traffic sitting and waiting while 20% progresses… at every stoplight in a world of 7 billion people. Now, I don’t have the perfect solution (although I have my ideas), but I see the opportunity to capitalize on. I don’t just think about what new app I could make that will solve this problem, but also how I could design the physical world to provide a more efficient experience for people on a tangible level. It’s not just stoplights. It’s everything. Look at the buildings around you, from its structure and floor plans to how it lays within its real estate on the city block. If you had the opportunity to design a city from scratch, think about how you would transport mass amounts of people in and out, how businesses and places could be grouped for ease of use and accessibility, how it could scale up with ease as the population skyrockets. Think about how signage leads new or unfamiliar people that depend on its guidance. Know that one can never assume people just know how to get onto the nearest freeway entrance from downtown. This fails miserably today. At some point, somewhere, a person made a decision to put every object where it is. That person could have been the business owner, the construction worker, or just some guy that doesn’t like his job and doesn’t care what comes of it. As these decisions are made over and over, experiences become unpredictable for people. One intersection is a stoplight, the next has a median, then the median disappears again at the next one. People can’t anticipate what’s going to happen or come up next, so they hesitate because they are scared, and frankly, can’t assume. Think about what made the best NBA basketball guards, like John Stockton, Larry Bird, and Magic Johnson, so great. They were able to see the floor ahead of them and where their teammates were going to be, before they were even there. They were predicting the future. They anticipated what was going to happen, and since they could do this so well, their performance was remarkable.
Imagine you are in your kitchen and you have two places you usually write down your shopping list, one is on a notepad on the counter and the other is a marker board on the pantry door. You are washing your hands at the sink and remember you need to get milk. As you turn to go write it down, you instantly hesitate as to which direction you should go to write it down because you know both options exist. That split second of hesitation degrades performance. Although people may not know it, our job as Designers is to make those decisions invisible. Not existent, rather. As people depend on their mobile devices more and more everyday, experiences must provide a clear path for people to swim through. Although there are always a large handful of actions you want to provide people, the most successful experiences pick the one single most important experience and optimize the design around just that. Of course, this is the hardest thing to achieve when there are multiple hands in the bucket. You always know when something has been designed successfully when you never hear anything about it ever again–your praise for great design is when people just keep using it. But you will always hear complaints when something is under-designed or broken. It’s sometimes hard to swallow the fact that visual design does not precede the architecture of systems. Through the strongly opinionated eyes of Designers, everything must be buttoned up in a perfect package. Everything must be cohesive to the point of obsession. In reality, there is no minimum viable product in a perfectly packaged product. Everything that is successful starts with a well designed base, or architecture, and grows from there. One must learn to stand before learning to slam dunk. We can apply this thinking to our everyday lives, helping to influence the practical design of everything around us. Although it can be hard to break the mold when influencing an antiquated mindset, good design will always speak louder than words. Stoplights suck and boy I’d love to see a world without them.
The moment people hesitate to make a decision, their performance is degraded. People are constantly making decisions, whether it’s on their smartphone, deciding which road is the right path to their destination, or even taking guesses at how to do something. Over time, as they guess at these decisions, their satisfaction drops drastically and they only continue to use your product because they don’t want to spend money to buy a different one–a better one.
-Author Thomas Squire
An invaluable year The past year I have spent interning at Numiko has been invaluable opportunity to my growth as a designer. Although I only worked for Numiko one day I was still given the chance to work on live projects for big brand and companies such as Design Council and Channel 4. During my time at Numiko I have been taken in as a member of the team and my day to day activities involved working on currents project with the rest of the design team. Although my time there each week was short it gave me flexibility to move between projects and briefs and every week saw me working on something new and developing work that progressed during my absence. As I was absorbing as much knowledge and experience as I could during my tuesdays at Numiko I was bringing back this knowledge into my studio practice at university. Most prominently was the way in which Numiko work through a project from the initial discovery stage through to define, design, develop and deploy. I loosely brought this through into my own way of working through briefs at university. This proved to be an extremely useful and time beneficial way of working through a brief. During the course of time there I have learnt everything from the tiniest keyboard shortcuts like cmd + up, down, left or right to move an object in 10 pixel increments to working with baseline grids across fully responsive websites. As a result of this internship my academic practice throughout my final year university has benefitted from the foundation of professional and industry skills I have been taught at Numiko. Over the course of the year I have worked closely with Head of Design, Matthew Tweddle, who has really shown me the ropes of working within a digital design studio. Throughout my time at Numiko Iâ€™ve always been treated as a designer rather than an intern which has meant has resulted in a hands on approach to design whenever Iâ€™m in the office. As an intern designer I have been given a broad range of tasks and projects to work from building brands to wire framing websites all of which developed my understanding of how digital work in created within an agency environment. 100
A stand out period of time for myself at Numiko has been the development of a brand for a national graduate scheme for getting young entrepreneurs to engage and grow businesses with the help of technology. I was involved in the project from very beginning from when the brief first landed into the studio. I was subsequently involved in each stage of the process following this from conceptualisation of the brand, developing a range of pathways and producing pitch boards to deliver to the client to present the brand. Although the brand unfortunately never made it live being involved in such a process from start to finish was massive learning experience for me one which benefited my studio practice at university in which I was working on several branding briefs with this space too. Numiko is an office of 28 people who collaboratively work together to achieve the highest goals they set themselves for each client and brief they take one. There is a strong, small community vibe in the studio in which every is able to work together effectively across many projects at once and a community that I am now a part of. After finishing my degree in June 2014 I hope to start my design career working with each and every talented person at Numiko and continue to grow and learn as a designer.
Colophon The Great Discontent thegreatdiscontent.com @greatdiscontent
Fantasy Interactive f-i.com @F_i
Yaron Schoen yaronschoen.com @yarcom
Method method.com @method_inc
Aaron Legaspi aaronlegaspi.ca @AaronAPLegaspi
Frog Design frogdesign.com @frogdesign
Amit Jakhu amitjakhu.com @amitjakhu
Studio Mister studiomister.com @STUDIOMR
Celine Nguyen celinenguyen.com @mynameisceline
Hello Monday hellomonday.com @hellomondaycom
Numiko numiko.com @numiko
Atheletics atheleticsnyc.com @athleticsnyc
Thomas Squire thomasquire.com @thomassquire
Teehan+Lax teehanlax.com @teehanlax
Christopher Butler chrbutler.com @chrbutler
Huge Inc hugeinc.com @hugeinc
James De Angelis jamesdeangelis.com @jamesdeangelis
Area17 area17.com @opticalcortex
Code and Theory
Jason Santa Maria jasonsantamaria.com @jasonsantamaria
Brady Voss bradyvoss.com @bvossss
Pro-Rata 3rd Year Graphic Design Student Intern at Numiko