At the Drawing Club meeting this week, we started by drawing a still life of gourds. After getting warmed up, Jill showed up briefly and mentioned Exaggeration which led nicely into the talk that ensued about group drawing. There are many ways to collaborate, generate ideas and draw together. At the meeting, we did a few techniques. Telephone Pictionary is always popular. “Grocery Cart Driving Spiders” evolved into “Spiderman Rollercoaster!” We also did a couple of round table drawing sessions. It’s where each person contributes a line, any kind of line, straight, wavy, or curved until something starts to develop. I encouraged everyone to riff when they felt like it, giving details to the abstract until it started to form something that none of us would come up with separately. After a couple rounds, each person had to finish the drawing that they were handed, adding shading and more details to flesh out the drawing. This is a good improvisonational drawing exercise. I think it’s valuable to take what would have been a mistake or unintended line and incorporate it.
Katsite Project 1 I am continuing to make deviations from my wireframes as I respond to critiques of this website. Above is the latest version. It is 192.0 K. I cut down the file size by using Google Fonts instead of the Adobe Edge Fonts which run their javascript that takes up over 100 K. I put the social media buttons in the “header” because I wanted them to be prominent. When I am looking to “follow” a website, I look for them in the top nav first.
Fadiman’s Critique
Why does it look so different from last week? Well, I had one of those moments where I realized I wasn’t fully grasping the brand’s identity. The logo seemed separate from the page and the navigation seemed to be slapped on there. Firstly, I redesigned the logo. Then, I consolidated the nav, social media buttons and logo into the header. And slipped the contant info into a third column on the side. Pretty much the principle of “important info flows to the top.” I reevaluated the content and separated the second column into more meaningful chunks.
I decided that despite how much I like seeing slideshows functioning, that my site should be something comfortable and not flashy. Especially content-loaded websites, I think that with all of this text, a slideshow as big as I was proposing last week would be more distracting than helpful or ornamental.
Sunday at InfoCamp, Namho Park shared a beautiful presentation about communication technology. It’s a matter of scale.
Firstly My Story I journal, I have a history and by telling some of those details to others I share my personal stories. In the olden days, my story wouldn’t have been told. At most, an entry in a family book, born, maybe a marriage date and then the date of my death. If I was a pharoah, I’d have a scribe following me around, writing my story as I was living it.
Nowadays, information storage is plentiful and devices to record my life are numerous. Human brains create narrative. We love making and consuming stories. (StoryCorps, QuantifiedSelf)
Nicholas Felton
Nicholas Felton is an infographic designer who collected information about his life, about his father, to create annual reports. These collections weren’t just data. They were curated to form meaning. He was one of the founders of Daytum. You think to yourself, I’m not that crazy data collector that he is. Well, guess what. He helped design your new facebook that collects all of that personal data for you and rearranges it into Timeline.
Others’ stories How can we ingest them easier? Answer: friendly interface. Facebook among others is so captivating because of all the stories, all of the pictures. Flipboard, Daum, Scavenger reinforce our pursuit of the intersection between media and reality.
Collective Story We are the stories that we tell ourselves. Our identity is reinforced by these stories. What does a city tell themselves about themselves? History has been curated by historians, but now we record our information. What can the data we contribute do? Will our tweets and facebook statuses condense into the historical narrative? When you generalize, individuals’ stories are bent and blurred. Ushaidi, A tech company, collects users contributions, showing graphs of frequency of crisis reports telling a very specific story about what’s happening in a region. (Other story-telling websites: Cowbird, Momento, We Feel Fine
Information Overload Curation has value by definition. If we let the #trending messages tell us what’s important, we might miss the things that truly matter. Tweets Per Second is a way to measure how important something is to culture some might say. Beyonce’s baby hit the top of the list whilst Steve Jobs death is number nine on the list. (article)
What are valuable metrics that will help us sift through all of the stuff that is recorded? Jonathan Harris demonstrates a photo essay’s power when his camera is hooked up to his heartbeat and increases frequency of capture as his heart rate goes up in The Whale Hunt.
As a civilization, we spend a great deal of time collecting information about ourselves, our past, our identity. The power of the machine to collect this information for us frees us up to do other things instead of scrapbooking, journaling and indexing. There will be a backlash. As individuals, we want to find ways to capture our memories in a way that will resonate best with how we think, whether that’s audio recordings, blogs or even drawing and writing. Mobile will be there. Mobile is our new scribe that follows us everywhere. Our phones are changing the way we think. It tells us stories and tells our stories and it fits in a pocket.
This should have been part of phase 1 of the Ravenna Garden’s website design project. I think I’m having trouble (as a fledgling designer) coordinating my efforts. It’s coded fine, but I was too proud of my working slideshow to notice the ugly.
Anyways, now’s my opportunity to go back and polish this website before next week’s presentation. Give it a nice logo and more thoughtful type. I drafted the R and then pen-tooled it in illustrator. I had hand-drawn all of the letters, but it looked kiddish. Until I am better at drawing letters, I’ll just be adding some flourishes here and there before trying to become the next Jessica Hische.
Sunday at InfoCamp, Lorelei Kelly, an interactive designer led the discussion of the problems and solutions that comes with managing designers.
Coordinating and Tracking Work– Use post-it notes, or a chart. Consider multiple purposes for these systems. Who are you trying to communicate with? Clients? Bosses? Team members? Consider weekly print outs of your process so you can quickly see the weekly transformation of your design. There’s also plenty of project management tools. (Freshdesk, Basecamp)
Especially if you’re working with other people, consider making regular events of some kind of checkpoint, either review, sign-off, documentation, etc. Use a short template and do it often. If you’re the one setting up the budget, add 20% to the amount for management tasks such as these.
Consistency in the Face of ambiguous requisites- Consider “Agile” or Lean UX practices. What is Lean UX? It is basically the practices of working more together, instead of checking back with the boss and waiting for the okay, its a side by side agree and continue kind of workflow so you get feedback sooner and can plow through.
If that’s not an option, Have effective meetings. Share your to-do lists. Have a change log and issues list. Find a way to manage documents as a team, If you’re leading ask what your team needs. If you’re not, don’t be afraid to let your leader know what you need to be successful.
Know your battles. Whether it’s with a client or a colleague, explain your design decisions. As a teammate or a leader, sometimes your preference seems like a requirement, but it’s not. People construct their documents differently, but still achieve the end goal. Be understanding when something is done in a way that you wouldn’t have done it, but it’s okay.
When I was somewhat inebriated I had this idea that it would be fun to make an animation using paintings I made. So, I spent the morning stitching them together to get that lame idea out of my system. I drew inspiration and information from this tutorial. I successfully masked something in my use of After Effects but when I tried to mask the scene twice, either one or the other but not both would be successful. This is a demonstration of my lack of understanding how the masking is inverted and layered to achieve what is done in the tutorial twice in one document. I will continue to experiment and learn from this experiment.
skills in use in this video:In this project, I imported layers from Photoshop Documents. To create the “footage” that I then manipulated with positioning and rotating effects.
Today, Jay Al Hashal talked to the class about the role of a UX designer. The Designer is a storyteller. These days stories are transmedial. We consume messages, each others stories from each other, in person, from our phones, the Internet, etc. So many different devices, but the Law of the Closest Screen applies. Our intentions don’t change, but our devices do. We want to check our email whether we use a desktop device or a phone. Our expectations of devices, “smart” devices grow higher everyday. What are those mobile sites that don’t perform up to our expectations but a waste of time?
Humanist Design Strategy The design process is about designing, prototyping, measuring and analyzing. One of the big differences between design and art is that design is calculated. Human-Computer Interactions (HCI) is a measurable topic full of studies and recommendations for best user-centered practices. Humans are mostly the same and we can make websites fairly accessible based on human limitations. See Fitt’s Law which is the model that describes how long it takes to point at something. See Behaviorism, the psychological system of reinforcement, which states essentially, if a behavior is reinforced it will become habit. Consider the User and their Goals. You can positively reinforce something by some nice design element popping up when the user does something right, perhaps something turning a bright green. You can also play on their fear of missing out (FOMO) by providing interesting and changing content. Will you guide the user through with clearly marked interface or let them be guided through with emotion and intuition. See Tiny Wings.
Prototyping As said above, it’s important to cycle through. Hashal said “If your concept is never evolving, you are not pushing it hard enough.” Whether it’s in your team or with your own analytics, it’s important to be able to draw conclusions about how effective your experience design is at getting the user’s goals accomplished. Transitions are important. Despite its disembodiment (it’s just a screen, you can make anything) the greatest designs are metaphors (they utilize schema) for something that people already understand and know how to use. How does this object move in space? Be consistent. Do not swipe and dismiss and check through and flip. People will understand your product as one thing. Pick that thing.
Making You have your idea. Sometimes, it’s not about having the best design, but implementing a good design. As a designer, you must be able to play politics, be able to sell your design. “Well… the user will like it,” is one of the best things you can say at a meeting. But you have to mean it. Have reasons for your decisions and it helps to use something like Google analytics to gather data about how users are engaging your design. When you are testing it, always do A/B testing. Have two designs (at least). Be a scientist, have a control and a variable to show that this specific design choice is more effective that current practices and that it’s valuable to change. Small changes are necessary instead of an overhaul redesign. Sites that generate business are like cities, you can’t shut it down because people work and live there.
Lessons from MobileFirst– design for the mobile options, the considering the real estate, usability, etc.
Reduce and Organize. Be efficient, if you don’t need it in your mobile site, you probably– but not always– don’t need it in your desktop.
Forgive. Users are curious. Sometimes they will delete something that they didn’t want deleted. Don’t punish them for it. Have a way out, a way to retrieve, a simple undo step.
Contextualization. Fancy word for step into their shoes. Gather information about the user’s environment. If they are the train conductor who has to engage with this design while in a moving car, navigating dark narrow corridors, be sensitive to that. Make the buttons big or glow in the dark or something.
Reinforce. Things should change appearance to show change. Ease the use, store their data so they don’t have to type it in all the time.
Disappear. Great design becomes invisible. It seems like the most natural way to do it. Have design that is easy as moving a part of your own body or as close as possible.
Saturday at InfoCamp, Aaron Louie asked his audience what is “cool?” People ask designers all the time, “make it cooler?” Or in the case of Seattle Central’s Marc Salverda “make it sexy?” We usually think “aesthetically pleasing” or worse, “trendy.” Cool is something others can say about ourselves, but if we say that we’re cool, it’s an automatic “not.” Can we have a definition, please? Aaron came to the rescue.
Polished Visual Design This is the relatively trendy part. Current polished design practices include a lot of white space, clean and minimal design, but we see this fashion come and go from Art Nouveau to Art Deco. It’s going to change again, but clean and efficient means polished these days. Example: Nike’s Website.
Making Something Work Better It’s our job as designers to throw away old things. This is not to say that we can’t keep important things and information that users want, but sometimes the assumption of “legacy” is incorrect. Focus your efforts. Do one thing really well, even it it means to segment your audience and become a bit more specialized. Example: Pair app. This is a social media app with a network of 2 people– it’s for couples to share their lives and their media.
Surprise and Delight Be unexpected and joyful. It’s not enough to do something that no one saw coming if it’s not a positive thing. This can be achieved by “easter eggs,” little secret bonuses that are there for your users to find and share to their friends like a secret treasure. Examples: List of Computer Easter Eggs
Amazing Experience: Awe The emotion of awe: beauty/flow/ social connection. What inspires awe? What is the evolutionary causes of the emotion “awe.” The collective movement of human beings, like a dance, relates to our identities as human beings. The interest in connecting with yourself and being in groups. We can create this sense of wonder by making things that are easy to share, that involve collaboration, that relate to our idea of self-improvement. Example: Arcade Fire, The Wilderness Downtown
Engrossing Storytelling Suspense and mystery. In a way, an “anti-usability.” Hid information, create, mystique, intrigue, anticipation. This comes with constantly reinventing. You must develop a reputation for creating beautiful things, but not give it all away, let them imagine. Example: How Apple says they are going to release something but they don’t tell you exactly what.
Kismet Arts Tangent 