Some guy turned these bags of chips upside down on a store shelf, exposing the package of half air. The package designers put solid printing on the top half of the bag to hide the air.
Great ideas: An avocado ripeness sticker and a crate sticker to verify excess tilting
An intelligent respectful way to deal with sensitive statues and plaques
Instead of removing statues and plaques of Confederate soldiers or other somewhat-inaccurate dominant people, the city of Santa Fe has added this plaque to the obelisk in the center of the Plaza. It does a good job of educating the reader with some context of the period in question. The new plaque reads, "Monument texts reflect the character of the times in which they are written and the temper of those who wrote them. This monument was dedicated in 1868 near the close of a period of intense strife which pitted northerner against southerner, Indian against white, Indian against Indian. Thus, we see on this monument, as in other records, the use of such terms as 'savage' and 'rebel'. Attitudes change and prejudices hopefully dissolve."
I sprayed lightly over the SON in the last name to emphasize EDMOND (the town
where this sign was posted) to provide memorability and improve retention.
Strive for perfection in most things you do. And almost all in your professional work. But, not everything - "lead a sane and balanced life."
Strip from Pearls Before Swine by Stephan Pastis.
Which is stronger? Here are some dictionary definitions:
• Ultra: beyond what is usual ordinary, excessive, extreme.
• Extra: beyond what is usual, expected, necessary.
In this case, the 'ad copy' doesn't help much - the consumer has to read the ingredients to see if there is a difference in quantity or dosage of the medicine.
I prefer Mega Ultra Extra Strength when using medications.
Looking cool is the easiest way to mediocrity - Terry Crews
More wisdom from Terry Crews:
I constantly get out of my comfort zone. Once you push yourself into something new, a whole new world of opportunities opens up. But, you might get hurt. In fact, you will get hurt. But amazingly, when you heal - you are somewhere you've never been before.
The original patent from 1891 shows the correct rolling direction, in case you ever doubted.
I'm just not sure if all 3 Es could be alike.
A better chart layout
1. The headline says 'Tops survey', yet the headlined item is at the bottom of the charted list. Why would anyone put the Top one at the bottom, instead of at the top?
Putting the top item at the top is more familiar, more intuitive, more appropriate, and clearer communication.
2. The rest of the items are in random order. Listing the others in decreasing dollar amount would be better for the reader to see a comparison - "Who is in second place?"
More tips for better Infographic Design.
Nice package design made a bit better
Concept: The ingredients of the protein bar are the focal point of the package label.
The simple, mostly text, package design is refreshing and helps this brand to stand out in a shelf crowded with options.
But, standing in a 7-11, its a bit hard to find and read the flavor - the most important variable a customer is looking for - it is small and at the very bottom. Repeat customers already know the ingredients are few and simple, they are looking for a flavor. To most customers, the flavor is the most important info on the package label. Here are some improvements (shown below right):
• Larger more prominent flavor variety.
• Place 12 g protein bar on one line in larger point size.
• Slightly smaller ingredient text, with tighter leading.
• Delete useless line art that accompanies the flavor name.
• Enlarge the product logo, but place it at the bottom.
• Delete the unnecessary reverse box behind the brand name.
• Replace the 'No' with a zero - to be consistent with the other items in the list.
• Delete the periods after B.S. BS represents one word, not two (there's a little bit of bullshit - there are additional chemical flavor ingredients).
Here are the packages from an Oklahoma bar maker:
More tips for better Package Design.
At Walmart, on the shelf were 6 options of Degree deodorant - look at the names of the options. Who wouldn't want an Extreme deodorant? Or one that works Overtime? And a product that can help with Stress Control? Sign me up.
What do these names mean? Sounds like ad copy bullshit. So, I asked the Walmart employee restocking products - she said they referred to the different scents. I asked her "What does Extreme smell like? Is it an overbearing odor?" "When someone works Overtime, don't they start to stink? Why would I wear that?" "Sport Defense?" She smiled feebly and I walked away - she had no idea what the names meant. Nor did I.
I want their best formula deodorant. That's all - just 1 product. Maybe 2 or 3 if they have very clear scent descriptions, like fried bacon or maple glazed donut. Or, maybe Extreme4 Maple Glaze Bacon.
This is becoming quite common - the number of soda flavors available, the number of items (200?) in the Cheesecake Factory menu, and everywhere else you look in the grocery aisles. What do they know - does overwhelming the consumer pay off in increased sales? Are we impressed to the point of wanting to purchase more?
Notice how many Oreo options are available - 22 different varieties of the Oreo Cookie. When I was a kid there were 2 options - Oreo and Oreo dipped in milk.
But, they didn't offer my new favorite - the Oreo Sample Pack - a variety of new flavors so I can try several to determine my favorites.
How much is a billion?
It takes 12 days for a million seconds to pass.
It takes over 30 years for a billion seconds to pass.
Reader Jason from the Washington DC area submitted this logo - he commented that it just had too much going on. It is the identity for the campaign for Mayor of Phoenix.
Better version below - simpler, clearer, more memorable. There is one memorable image and text.
• The image of the bird is tucked around the text for a better connection and relationship.
• Rise Together (in a sloppy inappropriate font) has been deleted. This slogan can be used in ads and posters.
• For Phoenix is smaller to allow Sarwark to be more prominent. Sarwark is the single most important word to be remembered.
Great idea for prepping daily pills
One of the lifestyle changes one makes upon aging is that the pile of pills taken each day grows to the point of needing some weekly or monthly pill boxes. I take about 10 pills each day - 3 in the morning and the rest with dinner. Soon after I began this new routine, I wished for a service from a drug company in which the customer would submit all pills taken with frequency and dosage. For OTC (over-the-counter) drugs like vitamins, minerals, and supplements; the customer could check items and mg quantities online. The company would then assemble the pill. For prescription drugs, the doctor could submit the prescriptions online. The prescription and OTC components could be mixed together or there could be two separate pills. The pills could be color coded: yellow = morning, blue = evening. The drug company would then formulate a single pill (or 2) with all of the necessary ingredients, and ship them. The customer would have to renew each month - allowing/requiring the customer and the doctor to keep ingredients current (it could simply be an email reply ‘No change'). But, I suspect there are too many regulations and drug ownerships to make the idea feasible.
In late 2017, I ran across the system below, an automated compliance strip packaging system, which packages all of a person's prescription and nonprescription medications together in perforated pouches for each time of the day - in sequential order, and each package individually labeled. On Saturday morning you'd tear off the 8a package containing all the necessary pills.
“This system increases compliance, decreases trips to the pharmacy and increases the likelihood that you are getting all the medications you need for the month," Pharmacist Scott Evans said.
• It eliminates having to go sort through 10 or 12 bottles while filling a med planner each week.
• It takes the guesswork out of which tablet goes where.
• The medications are synchronized so they can all be refilled at the same time each month.
• The packaging makes for easier traveling - each package meets all labeling requirements and one has to pack only the amount for the time traveling.
Below: another option for the same concept.
A pill box system with visual reminders
Below is the system I currently use to organize and simplify which pills to take at which time of the day. I wanted to make it better than just conveying what day to take. I rearranged the daily boxes in the holder tray so that their position communicated visual clues for the status of the pills - taken already or not yet taken. When the tray is positioned on the shelf, the sightline shows the full box with the label facing dead-on to the viewer, the half full position moves the label away at an angle, and the empty position places the label in a tough to see horizontal position.
Concept: rotate the boxes within the base to convey different statuses of the contents. Visual reminders of pills taken so far that day.
Left to right:
• Monday morning: All boxes full, labels facing user.
• Friday morning: Mon-Thurs boxes empty, Friday-Sunday boxes full.
• Friday afternoon: Mon-Thurs boxes empty, Friday morning pills taken - box rotated halfway up to show half empty.
• Saturday morning: Friday box empty, box rotated up all the way, label away from user.
• Sunday night: All boxes empty.
My guide to what layers to wear when going outside
And Ea Wy
Target discontinued its Merona label and much of its Mossimo line to make room for a series of new in-house brands. Launched in August, A New Day features apparel, shoes, and accessories, all priced under $50; and size inclusive - from XS to 4X.
Below left: Reader Mitch submitted this store graphic as an example of poor typographic layout. Although almost all of us will read the word and across the top - the designers meant for us to read down in columns, not across in rows. But,
1. We are accustomed to reading left to right, then top to bottom.
2. The dots in the first line help guide us to read across that line as a•n•d.
3. The word and in the top line is a very familiar word that we focus on immediately and unconsciously.
Confusing part: what is gained in readability, memorability, or comprehension by setting the words in columns? When set in rows (right) it reads better and nothing is lost in the design and layout. The reader should be encouraged to focus on the clothes and the Target brand, not on an unusual and poor way of arranging type.
Lesson: Make design decisions through the eyes of the reader/user, not the client or designer. Empathize.
Please be skeptical of advertising copywriters
Note the line that catches your eye - 3 Simple Ingredients. That's pretty cool. Not a lot of junk.
Wait, a closer look - It starts with 3 Simple Ingredients. Whoa, there could be many more, including junk. Note that starts with is set in a smaller point size and all lower case - like they're trying to sneak it by us without getting noticed.
Saw this logo on the left for a radio station in NYC (natch). It just didn't sit right - there were some elements nagging. The underline beneath the W didn't match the columns of the other letters and the stagger was abrupt from the W to the N. I got the concept immediately - a row of sound level bars that emphasize the NYC and set them as a unit distinct from the W.
In my head, I saw a taller box under the W and some tweaking of the other columns. The W sitting right on top of a red box, the N centered in the top of another box, the Y breaking the top edge and seeping its contents out into space.
When I checked online for other variations of the logo - there was the logo in a red square - it confirmed the decision to put the W atop a square. It was consistent and now made more sense.
The improved version has a bit more logic and more eccentricities to help aid memorability.
Making this logo better was an easy one
Not often do we see a brand that just doesn't work. This is one of those. The dominant horizontal slabs, the font, and the kerning are all too clumsy and visually awkward. The thick and thin letterstrokes are a bit too extreme. Notice the white masses formed where two or more letters with thick vertical strokes are next to each other (like the MBL of Assembly).
Solution: simply replacing the font with a condensed sans serif helps convey the industrial heritage of the facility and improves the legibility and the readability. The notion of setting the text in a condensed sans serif comes from the Jones Assembly graphics program, examples below:
They have already established condensed sans serif as their 'corporate' brand type. It was an easy transition to use it in the brand. A major influence on the success of a brand is consistency of application. Jones Assembly uses so many condensed sans serif selections in their pieces that it is a short jump to add the logo to that mix.
Compare the existing and improved brands on a Jones webpage:
The improved version also resembles the 'hamburger' symbol that denotes a Menu on a webpage. Recognition of that common symbol on websites could evoke a connection to The Jones Assembly.
Info: The hamburger button (sometimes called options, hotdog, pancake) is a button placed in a top corner of a graphical user interface. The icon consists of 3 parallel horizontal lines, suggestive of a list, and is named for its resemblance to the layers in a hamburger, pancake, or a hotdog in a bun.
Tapping or clicking this button reveals a menu. The icon originated to save space on smaller devices - tablets and smartphones. On devices with even smaller screens, the wider hamburger button may be reduced to three vertically stacked dots (a tri-colon or vertical ellipsis) described as a kebab. The hamburger icon was designed by Norm Cox as part of the user interface for the Xerox Star workstation in 1981, and saw a resurgence in 2009 stemming from the limited screen area available to mobile apps.
A better text message layout
• Includes the day of the week.
• Each appt time info on a separate line.
• Places action info in text block at the bottom.
• No one needs to arrive an hour early.
During the stay in the hospital for a total shoulder replacement, I boarded Brooklyn at her favorite dog daycare. After we got home from the hospital and had lunch, we went to pick her up. The next morning, I maintained the schedule of walking her each morning and evening. At first, I didn't have the energy and stamina to go very far, but, at least we got out and she (and I) could sniff the neighborhood. But, I couldn't reach my phone/computer in my right pants pocket. First, I put my phone in my left pocket, but it had to share space with the car key and a pen that I always carry. On one walk, I simply stuffed my phone in between the sling and my arm. Not bad, but I worried about it falling out. I then remembered that I had a a pouch with velcro on the back. It stuck easily to the outside of the sling and worked well as a carry-all. Then I realized I could also attach a cup holder to the flat top of the pillow on the inside of the sling. This had possibilities - it then became a design project.
Rest of the story and more info.
Stacking letters from familiar horizontal logos rarely works well.
Try reducing the logo to fit - stay true to the branding.
Design that tries to be 'cool' but fails as good design
The designer convinced the airline that a light font set in light grey on greybeige would be trendy and cool. No one thought to see it as the passenger would - it is tough to find and even tougher to read. I witnessed 2 people plop down in the wrong seat and numerous people pause to decipher their seat location. Remember, this is while boarding (usually after delays and airport chaos) and while the airline is desperately telling passengers to hurry up and find their seat. The design firm slowed down the boarding process because they failed to design from the user's point of view.
Another example of better kerning. I had to go the Aurarius website to verify that it wasn't supposed to be Aur Arius. More
The photo on the left is of a signboard in the WinterGarden atrium in the Brookfield Place (formerly the World Financial Center). It publicizes upcoming events on the monitor at the top of the unit. Okay, so far. But look at the sign added to the base - 'Please do not step or sit on base'. Bad design. Instead of a sign telling people what they cannot do, design the unit so there is no tempting seating area. Then, there is no need for a sign. The solution here is not about designing a better sign, its about designing better units - to be more respectful of their environment and more user-friendly.
Below: The OKC Museum of Art has instructed the gallery guards to warn visitors not to stand up on the base in this exhibit. Better: Don't build a base (which is unnecessary for the exhibit) that looks tempting to stand on.
Gruntled (the opposite of disgruntled) means pleased, satisfied, and contented.
Lessons in Contrast
Above: The Hyatt Place hotel has brownish letters on a brown background with a light bar behind the letters.
Below: The Tile Shop
Good contrast: Yellow, orange, and red on #7 grey.
Poor contrast: #8 grey on #7 grey.
Fun thoughts to ponder
Nighttime is actually the natural state of the universe; the only reason we have daytime is because Earth happens to be facing a giant star illuminating it.
What if sleeping is our natural state, and we're only awake to gather information for dreams?
Some of us are still "it" from a childhood game of tag.
The human brain is one of the most complex things known to man . . . according to the human brain.
Other than the end of your nose, you have never seen your face, only pictures and reflections.
At one point in your life, your parents put you down and never picked you back up.
Insects rule the world, but they don't talk about it.
If you are really sad, go outside and you will feel better after about an hour.
Which door is the better location for the sign, Please Use Other Door?
This is the building where I go for Physical Therapy (injured shoulders). The entrance is under the gable on the left, with the sign. Under the right gable is a set of double doors. It was necessary to post a sign telling first-time users to use the doors to the left. But, there are 2 doors on which to mount a sign.
The one above left is a bit better. The one above right could logically and, somewhat clearly, be pointing to the door to the immediate left, not the far left.
The Okie Ski Trail to Colorado
Thousands of Texans drive to Colorado for ski vacations. The combined population of the cities marked on the maps below is about 16 million people. There is currently no clear direct highway access from the Dallas area to the ski slopes of Colorado. To stay on a controlled-access interstate or toll road, one must go from Dallas due north to I-70 in Kansas or go due west to I-25 (or a cutoff).
A new toll road slicing at an angle from Oklahoma City directly to Pueblo Colorado would shorten the drive, take less time, and earn money for the OK Turnpike Authority.
The name and icon mark
To introduce and facilitate direction, the new road and existing highways in Texas and Oklahoma could be branded as the Okie Ski Trail. A mark to place on highway signs could be a green disk with a skier android figure inside. The green disk is familiar to skiers as denoting the easiest way down the mountain, just as the new highway provides the easiest way to the mountains.
Date of conception: 1995, while planning a road trip from OKC to Colorado.
Better button labels
This iPod speaker system (about $60 from Walgreens/CVS) has 7 identical buttons in 2 rows. With tiny text labels.
I often turn the unit on/off and change the playlists - in dim light. Absolutely impossible to decipher the button captions and I don't want to memorize them. The buttons, their labels, and their placement was not very well thought out. Poor attention to detail and poor empathy for the user.
So, I printed some new labels for only the buttons that I use - On/Off, iPod source, and Volume up and down. Better.
The logo for the Morning Edition on NPR is okay, but there are some concerns:
• Two rising suns? Don't most of us think there is just one sun?
• Rising above the horizon? The baselines of the letters form an implied horizon, but the bottoms of the suns are above that horizon.
• Fat outline sun? The sun is solid, isn't it?
The concept of representing the morning sun is valid. There is no good reason to put a 'barb' (the rising sun) in the word 'edition' - it is less significant than 'morning'.
Below are two explorations of options that address the above concerns - one centered and one justified forming an implied box. At the bottom is another existing version that is set on one line and a better one on the right.
Pesky shapes that don't belong
Notice how those triangles of black along the bottoms of the letters are a bit annoying? Or they should be. Designers can now easily improve the clarity of the typography - there is no longer a reason to ever say, "That's the way it came back from the typesetter." (That was a common excuse in the old days).
Setting type in outline fonts requires a bit of extra finesse - it is up to the designer to check for those pesky captured blobs and take care of them. Fill in the captured spaces or explore different point sizes for the fill and the stroke.
An example of a better sign that has an outline font
This is at an entrance to a hospital, often where frantic worried people are looking for help. Notice that the most important word on the sign below is the hardest to read. At least it's in red.
A better sign below right and some of the issues that have been addressed:
• Set the copy flush left for items that direct to the left and flush right for directing to the right.
• Moved arrows to the flush margin of each side. Now they visually help communicate direction.
• Removed the stems on the arrows (info is conveyed by the arrowhead, not the stem).
• Enlarged the arrows.
• Tightened the leading for locations that take up 2 lines to improve proximity and clarity.
• Enlarged point size and increased the kerning of the outline font.
More examples and suggestions at Sign Design.
Thoughtful placement of a door sign
Kudos to whoever mounted these restroom signs. He/she considered the user's line of sight, especially as they walked down this hall seeking the restroom. Instead of placing the 'Men' placard in the middle of the door (as is normally done), here they moved it to the left which allows it to be seen while one approaches the door, rather than waiting until one is upon the door.
A better way to respect the desperate customer
I was on my way to the restroom at some C-store on I-70 between Illinois and West Virginia. There was this great Restrooms sign over the hallway - it was easily visible from the front door. Nice job! I headed down the hall, but didn't know where the Men's room was until almost in front of the doors. So much clearer and easier to navigate if there had been signs posted on that back wall. So simple and so effective. More on Sign Design.
New symbol to designate restrooms for transgendered people.
Right: The women symbol was, all along, wearing a superwoman cape.
Symbol with the same but different meaning
Left: Existing symbol for handicapped/disabled.
Middle: A more human android figure in this new symbol that better conveys motion, action, and ability, rather than disability.
Right: Jim's improved version - the angle of the blue bar through the white wheel is parallel to the angle of the upper arm, and the racing motion has been softened some by making the front leg parallel to the blue box.
More on Symbol Design
Tweaking the GEICO logo a bit
This logo - that we've seen in numerous television and print ads - is almost there. There is a strong penchant to be symmetrical with 4 massive letters and a thin letter right in the middle. But, as shown in these images:
the left side is not quite the same as the right. The version below is better - the E now better matches the G C O with rounded corners. The symmetry, unity, and consistency of the masses is improved and the kerning between the letters is more comfortable - a bit more breathing room and respect for the letterstrokes and the counters.
Update to the essay on better Museum Hours
Update to the essay on making Starbucks better
All 4 app screens can fit into one:
A new product for the New America
Nike has become the first major manufacturer to make a hijab for Muslim athletes.
“It basically feels like you're not wearing anything, but at the same time, you're still covered, able to respect your faith, and do sports the way you like," says Haddad, a Muslim athlete.
A global brand making a sports hijab is about much more than just comfort while competing. “It's a game changer - it can spread awareness, compassion, and more understanding of what the Muslim community is all about." The hijab is already being worn by Emirati figure skater Zahra Lari. "I was thrilled and a bit emotional to see Nike prototyping a Hijab," Lari said. "I was blown away by the fit and the light weight."
The head cover, called the Nike Pro Hijab, has a single-layer pull-on design made from lightweight polyester in dark, neutral colors. The fabric's tiny holes make it breathable while remaining opaque, a requirement for hijab-wearing women. Nike began developing the hijab after some Muslim athletes complained about wearing a traditional head scarf during competition. The design process took 13 months, and the final product will be available in Spring 2018.
Better Pixelogic solutions
After I solved the puzzle Old Fashioned Tv, I thought it looked more like a microwave oven than a TV. I had to make it better. I did and sent it in - they published it a few weeks later.
Below: Snowsim saw the moon in Good Night and had to redo that one, too, with a title that expresses his/her frustration:
Some slightly better definitions
• Coffee: the person upon whom one coughs.
• Flabbergasted: appalled over how much weight you have gained.
• Abdicate: to give up all hope of ever having a flat stomach.
• Negligent: describes a condition in which you absentmindedly answer the door in your nightgown.
• Flatulence: A smelly British apartment.
• Balderdash: a rapidly receding hairline.
• Rectitude: the formal, dignified bearing adopted by proctologists.
• Pokemon: a Rastafarian proctologist.
• Oyster: a person who sprinkles his conversation with Yiddishisms.
• Circumvent: an opening in the front of boxer shorts
Source: somewhere on the internet.
A better Oscar announcement card
Warren Beatty was handed the wrong envelope for Best Picture. If the card inside the envelope were clearer - better typography and logical hierarchy, Beatty (or any person) would have more likely caught the mistake. Designer Brandon Jameson (with additional tweaks from Jim Watson) redesigned the Oscars award card to more reasonable specifications.
The existing card, designed by PricewaterhouseCoopers - the accounting firm that keeps the winners secret, is topped by the Oscars logo, which is a superfluous waste of space - and, it's the biggest element on the page! The winning film is listed below, centered and in quotes. That's a little too subtle, as the winner is the same size and weight as a long list of names that follows. And the category - Best Picture - is listed in tiny type at the bottom, underneath a line that looks like a blank waiting to be filled in.
Above right: Better. The category is at the top, in thin sans serif letters. "Putting the category in large type at the top assures the presenter they have the correct card, and cues them to what they're going to say," says Jameson. "But the category type is lighter weight, so even though it's larger, it doesn't steal any thunder from the winner's name, which is bolder than anything else on the card."
The text of the winner is now bold, larger, and without unnecessary quotes. To make it even more prominent, all the names beneath are U&lc, ensuring there's less of a chance to blend the two as one block of text. The Oscars logo is at the bottom and smaller. "I hate unnecessary logo placement, and this one was taking up valuable real estate on the card."
These changes make the results clear as day - and more importantly, obvious if you'd been handed the wrong card. The Academy Awards illustrate how subtle design changes can help prevent a very specific human error. "The people reading these cards are sometimes older, they've probably been drinking, and they're in the spotlight in front of their peers delivering some of the most important industry information of the year - these cards should be bulletproof," says Jameson. And as we now know, if someone makes a mistake, absolutely everyone will notice.
Why didn't they learn from the Miss Universe Pageant?
A few minutes after announcing Miss Colombia as the winner of the pageant, the show's host Steve Harvey walked back on stage. He interrupted Miss Colombia, who waving to the crowd in her new crown and sash with flowers in hand. "Okay folks, uh..." Harvey said. "I have to apologize. The first runner-up is Colombia. Miss Universe 2015 is Philippines!"
After a few awkward minutes, both Miss Colombia and Miss Philippines stood at the front of the stage. Another Miss Universe worker came out, took the crown off Miss Colombia's head (Miss Universe 2015 for 3 minutes), and placed it on Miss Philippines'.
"Folks, let me just take control of this," Harvey tried to explain. "This is exactly what's on the card," he said, holding it up for the cameras. "I will take responsibility for this. It was my mistake. It was on the card. Horrible mistake, but the right thing. I can show it to you right here," he said pointing to the card (with very small print). "The first runner-up is Colombia. Still a great night. Please don't hold this against the ladies. We feel so badly but it's still a great night."
A few simple improvements
• Arrows to guide the reader.
• All 3 levels aligned.
• Larger point sizes.
• Spelled out Second and First to avoid a glance at number 1 or 2.
• Winner name located more prominently - look how far down on the card it was on the original.
Improving the awkward skewed app for the Oklahoman
Boy, that angle looks silly - and for conservative right-wing media. I wrote them and commended them for the new app that shows the site now leans to the left. I thought that would fix it immediately, but no response at all. On the right - 2 versions, straightened out and with a better flag, and the full name.
A better arrangement of columns and info
In the far right improved QuakeFeed app, the earthquake intensity is listed first and right next to the city location. The date and time info are on one line to allow compression of info to fit more incidents on one screen (less scrolling). People access the app to learn, "Dang, how big was that one? And how close was it?" The arrangement better respects the desires of the user.
• Design from the user's point of view, not the client nor the designer.
• Minimal scrolling and swiping speeds access and eases use.
Why make this more difficult than necessary?
This Zoe's Kitchen restraunt is open from 11a - 9p. On NYE, they will be closed from 8p - 10p (but they close at 9p anyway - will they reopen at 10p?). It would be clearer if it just said We will close at 8p on Saturday, December 31, New Year's Eve. Or maybe not make it confusing and just open regular hours, instead of closing just 1 hour early.
Also, they will be open regular hours on Sunday, New Year's Day. That is a plus - that should be promoted on the sign.
Another ordering sheet that needed help.
Tough to decipher and read on the left. Middle: sketch. Right: Better version.
Read about a similar better order bag for WhichWich sandwiches.
The absolute worst color for a urinal screen
This is better:
Which urinal would you avoid:
The wrong place to mount a store's hours sign
A new CVS drug store opened nearby. But, the sign denoting the hours of operation could be in a better place - one that better respects the needs of their customers.
When do we need to read the Hours sign? Most often, when the store is closed. When it's open, we just walk right in - the doors are even automatic - they open up for us as we approach.
Scenario: One gets to the doors and they don't open. Is the store closed? They look for the posted hours. Since the customer is standing right in front of the doors, he/she looks to the right, then to the left, but no sign is visible.
The Hours sign is currently located at A below. If it is moved to location B, it would be visible from the front doors. It would be to the right, where most people are likely to look first.
Lesson: See through the eyes of the user. Not the sign installer.
Above: Where the sign is currently located. Below: A better location for the sign:
Unappealing email newsletter and how to make it better
I get this email newsletter, Times Insider, each week. All I see on the screen is a standard format old-school letter. Not appealing nor does it pique my interest. Click, Delete. Done.
Instead of a letter that I don't want to read (who does?), they could easily jump right to the lead story - the headline and the visual are much more interesting.
The letter is ego-driven - the editor tells us what she likes and is putting in this issue. Does the reader care who the editor is and how she introduces stories? Old-School Journalism - copy to read linearly. Today's readers scan, they jump to what is appealing. Repeat: letters of text only are no longer appealing.
Below: Because of the useless letter and the large photo, look how far down the reader must scroll to get to the first headline. More about design in the NY Times.
Better email newsletters - less ego
I support what this organization does - the Richard Dawkins Foundation. But the regular email (left below) I get from them looks like a letter (and an appeal for donations). I didn't realize until after the first few emails that there were interesting stories below the letter. The editor, Robyn, puts her picture and an intro to the stories first in the email newsletter. That is just a bit too much ego (like, who cares?) I also question the value of the letter - it just repeats what is in the stories that follow. The newsletter should be about stories, not the editor. Why not just get right to the info? We each get so much stuff in our Inbox - I appreciate those items that provide clear info with easy access. Which example below looks more enticing to read?
Below is another email newsletter link - this one from The New York Times. The intro letter just lists the stories below. Useless information. It seems both of these editors have some ego issues (they like to see their name in print) and both are from old-school Journalism - today's reader scans to topics of interest. We do not want to read letters with no useful info in them.
Below: From an organization that wants to restore the USA National Motto to E Pluribus Unum. The email posts are visually overwhelmed by the big black box with redundant information. It becomes so dominant, its tough to see the lead story headline. I softened up the box (blue on white) and reduced it. And made some other tweaks. I emailed them and included the two images above and told them to use the suggestions as they wished.
Their reply: Thanks for the suggestion. We think we will make a change.
Student Union map with the Basement at the top, 4th floor at the bottom.
Existing: Above left. Above right: Rearrange floors to be logical and familiar.
Below left: Better: Move maps to left and text legends flush left next to them. Below right: Best: Enlarge maps and place them next to their floor legends.
Nice job of incorporating numbers within text
A better Walmart app: no scrolling - 2 screens into 1
On the Walmart app home screen, the user has to scroll to access all the options. i use Walmart Pay and can't even find the icon on the home screen - I have to scroll down.
The screen has a lot of wasted space, the layout is too open, and there is not enough visual hierarchy to guide the user. Improvements (image above right):
1. Enlarged Sign In text/button.
2. Tightened rows of text/Icons so all info fits on one screen - no need to scroll.
3. Moved labels closer to their image icons.
4. Enlarged the Walmart Pay icon.
5. Separated the main categories with Walmart blue lines.
More on app design.
Good example of bad text copy on a sign
This sign was at the airport security checkpoint where travelers move into the concourse.
ALL PERSONNEL ARE TO USE THE MAIN EXIT TO THE WEST OF THE BUILDING
1. Personnel Sounds like government or military jargon. I doubt the general flying public thinks of themselves as personnel.
2. Main exit Why would anyone know which exits are main and which are secondary? We entered one way and we want to exit another way.
3. To the west Have you been in airport? After a ride to the airport or parking your car, walking through hallways, up to counters, and through security lines, do people really know which way is west? Doubt it. Nor do they care.
4. The copy has a Prohibited or No symbol over it, thereby suggesting all the copy is wrong.
This is a great example of design from the inside out - from the viewpoint of the TSA person in charge of putting up a sign. To that person, the copy makes perfect sense - he/she is 'personnel', they know which exit is the 'main' one, and they know where west is.
Most important lesson: See through the eyes of the user, not the designer.
A very simple way to make this procedure easier
This is the scale at the Heart Hospital check-in area. Notice that the digital readout is mounted directly above the scale. That means when the patient steps on the scale his/her body is right in front of the readout. Each time I am there, the nurse makes awkward contortions around me to read my weight. Some even set their clipboard on top of that machine on the right. Also, each time, I mention to the nurse how much easier it would be for everyone if the readout was moved over so that both the patient and nurse could easily see it (proposal above right). And, each time, I get lame excuses, "That's the way they built it." "That's not my job." (just nervous chuckles). Two problems here:
1. The mounting of the readout with no consideration for the users (lack of empathy).
2. The I-don't-give-a-fuck attitude of the nurses.
What letters are these?
I can't get past the letter A - it's quite strong for AA. Or, maybe RR.
But, I guess those are the letter D - the entity is Death with Dignity. And what is that arc bridge-like thing?
Great news - Death with Dignity tweaked their logo:
They saw the light - those marks were not being read as Ds. Now, maybe they will pay some attention to the text type. Above right: the throwaway 'with' has more weight and is paired with 'Death' - now there are two lines just as there are two D marks - and the text respects the Ds by aligning to the arc:
A better layout for elevator buttons
Buttons on an elevator panel should be placed in a composition that is orderly, logical, and intuitive. Lower floors should be towards the bottom and the numbers should increase as their location rises on the panel. Rather than in horizontal rows (like pancakes with maple syrup stacked on a plate), buttons in vertical columns are more like the floors in a building. The user wants to travel up or down, not left or right.
Typically, button placement seems random and not very well thought out from the user's PoV (all design should be built from the user's PoV, always.) From the reference point (usually the Lobby), the user looks up to find their floor, or down if leaving the building. Intuitive, "I want to go up."
Complete essay with fotos and examples.
Better Emergency and Information button placement
Walking through the subway station, I noticed this call box mounted on a column. The lettering was easy enough to read, but the buttons weren't quite right. It seemed there might be two options, but it wasn't very clear. Was it one button for Emergency Information or two buttons - one for Emergency and another for Information. As I studied it more closely, I saw the second button below the word Information. Two distinct options. There are 3 problems:
• The Info button does not stand out and can be easily overlooked, especially from a distance or if in panic mode.
• The info button is green. Blue is the standard color for Information on signage.
• The text word labels are not in proximity to their buttons (the red button is closer to Information than it is to Emergency).
On the right, above, is a revised version with a green info button and the labels moved closer to their respective buttons. Below: side by side comparisons:
Lesson: Proximity is an important design guideline - position related elements in close proximity to each other.
A better message and graphic for distracted driving
Don't text & drive is a bit too demanding and abrupt. It falls short of educating drivers what to do (Just say no was also a bit too abbreviated. Okay, after saying no, then what?) I saw a phrase, Call or text later. Nice and simple. But, still not satisfactory for an important or timely message received while driving.
The media campaign to not text and drive doesn't offer an alternative, instructions on what one can do to minimize distracted driving. Pull over, Stop, and Talk/Text is a positive action that allows the driver to accomplish a task. The only downside is the driver may arrive at a destination a few seconds later. The upside is more alert drivers: less sitting when the light turns green, less easing into another lane, less slamming into cars in front.
Another brilliant idea
New York State has introduced 'Texting Zones' along its major highways and thruways - pullout stops where drivers can read, write, and send texts, phone calls, and emails. Governor Andrew Cuomo said 298 signs will be positioned along the state's busiest roads, pointing drivers to 91 Texting Zone locations. The zones will cost nothing to build as they already exist in the form of rest stops and parking areas. It's really all about the signage, branding the locations, and educating drivers.
While the Devon Tower seems to claim artificial superiority - it does not respect it's neighbors. There are some nice views from the top of the tower and nice views of the tower from the recently remodeled Myriad Gardens (which is superbly designed and executed). But superficial pride and nice views are not quite enough to justify the ego-driven massiveness of the new tower.
Lesson: Part of successful and thoughtful design includes respecting the environment - whether it is an ad, a poster, or a building. No design solution lives on it's own - each is a part of a larger community.
From Boom Town: The Fantastical Saga of Oklahoma City by Sam Anderson:
• "You can navigate by the skyscraper - skyscraper, singular, because there is, by modern standards, only the one, and it is so completely out of scale to the rest of the city that you can see it from everywhere else. It is nearly twice as tall as any other structure for one hundred miles in every direction. It dominates downtown, glittering like an open blade. This is the Devon Tower, headquarters of one of OKC's biggest energy companies. The skyscraper was meant to make the city seem big, but mostly it makes everything around it look small: thick, stocky, ancient, heavy, extremely midwestern."
• "Everywhere we drove, Orton and I could see the Devon Tower - the disproportionately huge skyscraper that dominated the horizon. “It's really awkward," he said. "It looks too tall, standing there by itself. They'd have to build at least one more that big before it would start to look normal."
Above: More recent shots with a new Tower to the left of the Devon. Many people, seeing the bizarre awkward tall tower hoped that new tall towers would help the new tower stand out less. But, new buildings announced and predicted for downtown OKC will all be low- to mid-rise buildings. As those fill in some of the gaps in the skyline, that will only make the Devon Tower stand out even more and look more out of place.
Below left, a better option: a rendering of a lower tower, as if the building had respected its environment. Below right: a rendering of two towers on the site - to provide similar (or more) square footage as the built tower, but in a way that is more appropriate and respectful of downtown OKC.
Below: How some images have addressed the awkwardness. The Memorial Marathon placed a seal to balance the tower. This Oklahoman ad used splashes of color. The existing CBD logo simply shrunk the building and the logo tweaked to show a more accurate scale of the buildings.
More, maybe all, drinking fountains should have bottle fillers
Above is the bottle filler fountain at O'Hare Airport. More people are carrying empty bottles through TSA and then filling them before boarding. Nice thoughtful move by the airport for the traveler's convenience. With the proliferations of water bottles, disposable and refillable, at the gym, at work and school, in cars, and while hiking; there should be a better way to refill them rather than having to hold them under the low spigot used for sipping. Better: two separate spigots so that 2 people can use the fountain at the same time, one drinking and one filling.
An outdoor fountain seen in Colorado with 3 spigots - sipping, filling, and dog lapping:
Be careful when setting type with thin letter strokes
They often just drop out and are very tough to read. Saw the promo card above in a coffee shop. Even closer, it is still hard to read.
The two most important keys to solving design problems effectively
Great design is concept-driven; based on a great idea. Without one, a 'solution' is just decoration, embellishment, art.
Empathy. Point-of-view. See, think, and act from the target audience's point of view. Not from the client nor designer.
A better way to leave a tip from those who don't carry cash
So many of us no longer carry cash - but how do we leave a tip for street musicians and subway entertainers? Sometimes I stash a dollar or two in my pocket. But, this is a better way. Visa has introduced a 'social experiment' entitled StreetTaps. To display the capabilities of digital payments, the BBDO ad agency installed digital payment terminals allowing street musicians in public parks to accept tips from mobile phones. It can be preset, usually for one dollar - so, a tap charges or debits your account $1.00. StreetTaps is still in the works, but the DipJar is currently being used:
Just dip your card and $1.00 (or $2, whatever was preset) is deducted. No receipt, no buttons, no input - just dip and go.
The final version has no void to collect coin and bill tips. They may have discovered that coins would get stuck in the card slot or that bills covered up the card swipe. Below: another example of the DipJar in use, at the 9/11 Memorial in NYC:
More info at the DipJar website
Why do so many web and app sites still cling to old-school journalism?
The story below was on some news feed. The headline was intriguing - funny PortAPotty stories. When I click on the link, I want to begin reading the stories. Instead, the author felt a need to bore us with an intro story about how shit stinks. And this crap: "What follows are six of the funniest, most disgusting, and horrifying real stories we could find." Yes, we got all of that just by reading the headline. No need to repeat it.
Look how much junk there is to scroll through (3.5 screens) before getting to the disgusting stories. Without the junk, the reader would see the first story on the first screen (below). This is a different era in info consumption. Give us the info, skip the flowery j-class crap.
How to make the new Met logo even better
Above: The former logo for The Metropolitan Museum of Art (everybody refers to it as the Met) in New York City featured a drafting rendered letter M. But, as The Met moved its modern art collection into the former Whitney Museum building, the former logo would no longer be appropriate. There needed to be a new brand to better convey the new Met. A logo with images would be tough - how could they represent such a vast collection spanning thousands of years and hundreds of styles and genres of art with just one or a few visuals?
In early 2016, The Met introduced a new logo - conjoined letters that "connect the past with the future." The museum's VP of Marketing says, “The Met represents over 5,000 years of art, from all over the world; at Fifth Avenue, the Breuer, and the Cloisters. This notion of trying to make the connections - it was what drove the look of the logo." The conjoined letters connect the past with the future. But, that concept could/should be carried a step farther - to not only connect the letters horizontally, but also vertically. Connecting the past with future in a linear timeline and connecting the depth of the collection into a single entity.
Left: New existing logo. Right: Improved version:
• Letters touch vertically as well as horizontally.
• The thick stroke of the H aligns above the thick stroke of the lower E.
• Serifs are vertical, not slanted or skewed to respect the verticality of the thick letter strokes.
• Thin lines in the font are a bit thicker to better relate to the thick strokes and provide more strength to the logo.
• The 'barbs' of the missing serifs on the Ts remain for increased memorability.
• The left and right margins align, forming a better frame.
The revised mark is more orderly, more cohesive, and more connected (which is the main design concept).
Lesson: Figure out the strength of the piece, exploit that and minimize the rest.
Full story of a better Met logo More on Logo Design
Making the Starbucks app better: 4 pages into 1
The user taps PAY on the black home screen - a new page opens and the user must tap PAY again to get to the code for scanning at the register. The 4 pages above can easily fit onto one page (below). Now, all the pay tasks are seen on one screen. Easier to understand, easier to use, and quicker to access.
A better way to lay out an app screen - no scrolling
The Bank of America app almost gets all the info on one screen, but not quite. There is no need to devote a quarter of the available area to an unnecessary stock photo of NYC. More on app design.
Another example, from the app for The Week:
Above left: reader must swipe copy up to continue reading. Right: all text copy fits on the screen.
Solution: Delete unused white space to tighten up blocks of info - decrease the amount of scrolling.
A better way: all the same info, with the important info on a single home screen. More on app design
A better way to align answers on Family Feud
Above: Copy set in the traditional flush left layout. And, yes, her husband got 182 points out of 200. She only needed to get 18 points to win the jackpot, but her answers were so off that she didn't earn any additional points. So sad for her. Below: setting the copy so the answers respect their points earned by aligning to a central margin:
More on typographic design.
Rubes by Leigh Rubin
A better way to align a list
This was a newspaper insert for a pizza chain. The list of locations in the center wasted lots of space and was a bit tough to use effectively. Improvements:
• Phone numbers closer to location
• Larger point size for better readability
• Fewer unnecessary marks: ( " .
• Less info in locations - deleted W, St, Ave.
• More consistent setting of Oklahoma City SW & NW
• Better spacing within coupons
• Larger logos inside coupons
Of course, restraunts should charge for water
We pay nothing for a cup of water but about 2 bucks for soda and the only difference is a small bit of flavoring.
Why should we expect others to subsidize our choice of drink? Of course, we should be charged for water. Full essay
(And that is how I spell restraunt. More info.)
How to make a video look worse, and better
Often, I see videos that don't fill the allotted space so some poster adds some side bands, often just repeated, blurred, enlarged, or distorted versions of the central image. But, those options just make the total image more complex and cluttered and compete with the video content for attention. Maybe it would be better to add solid grey bands, or a color that respects the video background, to fill the space.
Design Ideas blog