Sunday, April 22, 2012

Am I Too Late to the Web Design Party?


Ask a Madman: Am I Too Late to the Web Design Party?

 Speider Schneider | Comments: 1

I’m a graphic designer just now getting on the web design bandwagon. Am I too late to the party?

For years, my father refused to learn how to set the clock on his VCR. Twice a year (if there were no power failures) I’d get a call from him, asking how to do it. Eventually, he just got acclimated to deducting an hour from the clock time in the spring and summer months rather than try to learn it.
So when my mother bought her first computer, I started screening my calls. But soon enough she learned how to do an email attachment and even set up her own blog—oddly enough—about how to set your VCR clock.
learning web design, too late?
Don't worry, you aren't that late to the web design party.
Some graphic designers have felt left behind by rapidly changing web technologies. At first it was just easy drag-and-drop web design software supplemented by a simple understanding of HTML. Soon Flash and Java scripting became the norm. Then HTML gave way to DHTML, XHTML and HTML5 and so on. Now, putting Dreamweaver on your resume incites snickers from 23-year-old creative directors.
Many of my peers are taking web classes, trying to catch up on needed skills. Some succeed enough to not be laughed at; others just can’t keep up with all the new programming languages and plugins. For the 23-year-olds who grew up coding HTML and build apps for fun, print designers are like the elderly parents who call about VCR clocks. Print designers who have a few more years (or decades) before they retire need to learn some new tricks.
If you confuse PHP with PCP and think jQuery might be something conservative politicians want to outlaw, you may be a little too late to the technology party. To stay competitive with younger, more savvy designers, you’ll need to work twice as hard to catch up. It means not only keeping up with the changes Adobe makes to its graphics programs but knowing about web language developments, learning new software AND having examples to show employers. No one said it would be easy. 
learning web design, too late?
It's never too late to get back on your feet.
In fighting obsolescence, it might seem like there’s just too much technology to digest. So we’ve boiled it down to four main points for you to focus on. Being familiar with all of these concepts is important; being an expert in one of them can help you score jobs and keep hustling.

Learn WordPress.

WordPress makes it easy to set up websites and blogs for clients—and yourself! In fact, the WordPress content management supports the majority of websites started today. You can use a stylish theme to get started, and when you learn some code, you can customize it or even start building and selling your own awesomely designed themes. HOW Interactive’s got a whole series on how to use Wordpress themes, plugins and tools.

Be a presentation software guru.

Believe it or not, there are design companies that do 90% of their business in creating digital presentations. Creatives excel at presentations because of our ability to make beautiful visuals, and clients big and small need presentation material. While PowerPoint is still the gold standard in corporate environments, keeping up with emerging presentation technologies can be a great selling point for yourself. For example, check out this amazing animated presentation made with Google Docs:

Stay on top of new technologies.

From left: a QR code, a Microsoft Tag and a Data Matrix.
If you haven’t seen these crossword-looking things on packaging or posters, you aren’t getting out enough. QR codes are barcodes you scan with your smartphone to go to a web page, video, app or to make a call. The boring black-and-white squares can also be modified with great design and color. New design firms are popping up everywhere to handle the design of these codes. With trial and error, you can still create some really impressive pieces for clients. (But be careful you don’t end up in the annals of QR code fails!)
And it’s been around for a few years, but augmented reality technology is starting to make its way into our daily lives. It’s a way to interact with your surroundings through your smartphone’s camera—the videos in this articleare great examples.

Prepare for the mobile web. 

Oh, to have been in the forefront of this technology a few years ago. It’s no secret that making just one monster app like Angry Birds will let you retire. Two will let your whole family retire. Three popular apps, and you can buy a better family! 
But responsive websites (ones that work just as well on laptops as they do on tablets and on smartphones) are the real future of mobile apps. It will take some training for a print designer but having a creative eye is the key to being a superstar of this technology. And if you aren’t ready to design for the mobile web yourself, justbefriend some developers!
There are many avenues for creatives to follow to stay on the forefront of technology. It takes hard work, dedication, imagination and the passion we all feel by being creative. Catch up or get left behind—the choice is yours.

Thursday, April 19, 2012

ADC Young Guns X




ADC Young Guns
is the only global, cross-disciplinary portfolio competition that identifies today's vanguard of young creative professionals, age 30 and under.


Call for Entries to ADC Young Guns 10 is now open! 30 or under? Check out the rules and entry instructions, then register and login to get started.


The regular deadline for entries is May 8. See all deadlines and fees here.


Questions? Take a look at our FAQ page or email info@adcyoungguns.org.

Mohawk Paper: branding + promotion




Mohawk Connects the Dots

Mohawk Logo, Before and After
Established in 1931, Mohawk, a fourth-generation family-owned business, is the largest privately owned manufacturer of fine papers and envelopes for commercial and digital printing in North America. Mohawk employs over 580 people and operates three paper machines in two mills in upstate New York and two converting facilities in New York and Ohio, with warehouses around the U.S.. Popular paper brands under Mohawk’s portfolio include Superfine, Navajo, Via, Beckett, and Strathmore. Last week Mohawk announced a major reinvention of their business to “thrive in today’s digital world” and today marks the launch of a snazzy new website designed by Hydrant and developed by Avatar, as well as the introduction of a new identity designed by Pentagram partner Michael Bierut and associate partner Joe Marianek.
Disclaimers: I worked for Michael Bierut at Pentagram. When I worked there I worked on Mohawk projects. Joe Marianek sometimes contributes to Brand New. Mohawk is an advertiser on UnderConsideration (starting in May). I know many of the people involved in the brand/marketing side of Mohawk. In other words, I have so much conflict of interest writing this review that you would think my pockets are lined with cash. But after six years of writing reviews I believe I have established I am fair. Lastly, all the visual assets arrived last night and there is no contributing writer up at 5:00 am, like me, to cover this identity on the same day it launches. Anyone who finds a problem with all this: deal with it.
The launch of MohawkConnects.com is the customer’s first introduction to Mohawk’s vibrant new brand designed by Pentagram, Mohawk’s primary branding agency for more than two decades. Michael Bierut, who leads the Mohawk brand team at Pentagram said, “The logo is a monogram for the name Mohawk. It’s based on the letter M, but it’s also constructed to evoke the papermaking process and the printing process, both of which involve paper going around cylinders,” he said.

The logo also speaks to the basic idea of connection, which is what Mohawk paper is designed for, “Whether it’s for a small book of photos featuring your niece and nephew or for a giant global corporation — it’s about communication,” said Bierut.
— Press Release
Mohawk
Mohawk
Mohawk
The old logo, also designed by Pentagram in 2002, was an attractive wordmark based (or perhaps purely, I can’t remember) on W.A. Dwiggins’ Metro. Nothing fancy but nothing earth-shattering either. The new “M” icon seems to take its cue from the open-legged “M” in Metro to create a lively visual element that manages to capture many of the press release talking points, from connectivity to paper-making. To me, it looks a tad more like a commercial printing company logo than a paper company because of the cylinder approach and the color overlays — it’s not an altogether bad thing, since a big bulk of Mohawk’s paper goes through big ass printers. The icon is attractive and punchy, for lack of a better word and, in contrast to the previous logo, takes prominence over the company name, now subtly typeset in House Industries’ Chalet. I’m not convinced if it needed to be set in all lowercase — the icon already conveys friendliness and the uppercase “M” would have balanced out nicely with the “k” in the end. The icon looks best when it’s in multiple colors as opposed to a single hue and definitely better than the single-color, stroke version which starts to look more like something out of a kids toy box. Nonetheless, the logo is a charming new asset to deploy anywhere from paper reams to the web.
As a bonus, the logo animates well and it even has a sound mnemonic. See it (and hear it) here.
Mohawk
Display type: Chalet, all caps only.
Mohawk
Text type: Sentinel.
Mohawk
Mohawk
Mohawk
Ream.
Mohawk
Mohawk
Mohawk
New Mohawk Product Selector by Michael McGinn Design Office. Photos by Alex Tobin.
Mohawk
Mohawk
Mohawk
In application the logo proves to be a playful element that can be blown up big really nice and it makes those color overlays stand out. The use of the medium weight of Chalet doesn’t feel like it works very well with the big bold patterning. It tries to take on a spare European feel but, to me, it starts to look cheap and generic and, instead of creating a pleasant contrast, it goes against the all lowercase use of Chalet in the logo. Overall, there is good potential in the identity and there are dozens if not hundreds of applications to experiment and take the elements in different directions (perhaps even elevating Sentinel to more of a display use).

Wednesday, April 18, 2012

Interactive eBook Apps: The Reinvention of Reading and Interactivity

Interactive eBook Apps: The Reinvention of Reading and Interactivity


Interactive eBook Apps: The Reinvention of Reading and Interactivity

The invention of the tablet PC has created a new medium for book publishing. Interactive books are everywhere, and have revolutionized the way people consume the printed word. With the recent software available to allow easy creation of interactive books and with the race to bring these products to market, there seems to be a more and more dilution of quality and a loss for the meaning of interactivity. When publishers create new eBook titles or convert a traditional printed book to a digital interactive eBook, they often miss the added value this new medium can provide.
It’s important to understand the distinction between apps and eBooks, as it's something that often confuses both publishers and consumers. It basically comes down to formats; apps are mostly native iOS orAndroid software, whereas eBooks are documents of a particular format, such as the open standards EPUB and Mobipocket (.mobi). And eBooks can be further distinguished from “enhanced eBooks,” which use formats such as ePUB3 for iBooks (Apple) and Kindle Format 8 (KF8) for Kindle Fire (Amazon).
eBooks were the first to appear on devices such as the Kindle, and have very limited interactivity. You are mainly able to flip the pages, search for content, or highlight words to see a dictionary definition. These devices also allowed font size to be increased to enable visually impaired readers enjoy books more easily. This gave publishers the unforeseen benefit of regaining a large population of users who couldn’t read printed books.
Enhanced eBooks (ePUB3) are a new digital publication standard that allows easy integration of video, audio, and interactivity. I expect this format to advance the future of textbooks and other educational material. Future textbooks might be able to "read themselves" with audio narration, perhaps preventing students from actually reading. But the benefits outweigh the downsides; for example, the new text books might also offer the ability to make and share annotations without destroying the book, interactive self-tests throughout the chapters, and generally a much more enjoyable learning experience.
Apple has recently released iBooks Author, a free eBook creation software that lets anyone with a Mac to create iBooks textbooks, cookbooks, history books, picture books, etc. iBooks Author generates a proprietary format for books that will only be available for sale on Apple devices. Adobe has also made available a Digital Publishing Suite via InDesign for the iPad, Android, and Blackberry platforms. Mag+ and Moglue are two other independent publishing platforms that are worth mentioning.
This video was released by Apple to promote the iBooks Author:
Interactive eBooks is a category for apps designed specifically to utilize the powers of tablets to enable users to interact with the storyline in sight, sound, and touch. I like to think of interactive eBooks as an evolution of the printed book with added interactivity in order to create an experience beyond the printed format. Examples of interactive eBooks include pop-up book apps for kids, interactive travel guides that utilize the device GPS capabilities, cookbooks with built-in timers and video recipes, or any traditional book that now uses the tablet to enhance the experience with interactivity.
Grimm's Rapunzel 3D Pop-up Book
Grimm's Rapunzel ~ 3D Interactive Pop-up Book
On a touch device, interactivity is the ability to engage with the user interface, including the ways you move your fingers on the screen, the way you to select an app, or how you browse the Web. Interactive eBooks are, by definition, an enhanced book-like experience that have a different core premise than other types of apps (with the exception of games perhaps). Whereas in most applications, interactivity focuses on menu navigation and interaction with the user interface as means to achieve a goal (view an image, find an address, read an email), interactive eBooks provide interaction with the content and storyline, and therefore offer a unique experience each time. A good example of is Richard Dawkins’ The Magic of Reality, where you interact with the storyline through interactive demonstrations and games that allow you to get hands-on with the science discussed in the book by, for example, letting you simulate the effects of heat, pressure, and gravity on different states of matter.
The experience of interactive eBooks should not be confined to animations based on touch-and-response interaction, or merely flipping the page; when designing these Books one must ask what is the enhancedexperience—why to move from print to digital, and how to create value and fun.

Interactivity for the Sake of Interactivity

If a book app does not use interactivity in order to enhance the reading experience, it does not belong in the interactive eBook category. In the race to bring interactive books to market, some of the books have only featured very superficial interactivity—what I call “interactivity for the sake of interactivity”—where, for example, touching an image activates a simple animation such as making a butterfly fly, or a tree drop leaves to the ground. These interactive experiences do not add value to the story, and are therefore somewhat meaningless.
There are a few exceptions where this type of interactivity is actually a success. For example. one of the first books published as an interactive app for the iPad was Alice in Wonderland. This book was a phenomenal success though offered nothing but eye-candy interactivity. When the app was first published, the reviews called it "a reinvention of reading” that made clever use of the accelerometer to make Alice grow as big as a house or to throw tarts at the Queen of Hearts and watch them bounce. Although these activities through the 52 pages of the book are fun, I think they distract from the actual story. The reason this book was such a success is due its having been published when the iPad was fairly new, and touch interactivity was still an exciting experience.
Another book that was fairly successful at the time was The Pedlar Lady of Gushing Cross, which offers narrated animation with very basic interactivity, but was considered revolutionary when it came out because reading the story while seeing the animation unfold was definitely an enhanced experience to the young reader. However, this book did not offer any real value through interactivity, and might as well be classified as a short animated movie. The limited interactivity of seeing letters animate while you tilt the device was merely a gimmick, as you can see in the video below
Cozmo's Day Off is an interactive eBook that was on the top-seller list for many months, and is packed with interactive elements that made it a great success. It contains over 100 unique audio and animated interactions. However, this app would be better characterized as a game for young kids and not as an interactive storybook because the story seems secondary to all the bells and whistles, and it’s written in style not intended for young audiences. But perhaps this is a case where interaction simply for the sake of interaction can be the whole point of a book.
The image below shows all of the hotspots that trigger an animation sequence for one page of the book:
Hotspots for Cozmo's Day Off

Interaction for Value

It is possible for interactivity to go beyond the superficial, to add value to the book and create an experience that would be impossible in print. Here are a few examples of such cases.
Al Gore's Our Choice is a great example of how meaningful interactivity creates an engaging and fun learning experience. With clever use of interactive infographics, animations, documentary videos, and images, this book is a great example of what the future has in store for digital publishing.
The Martha Stewart Cookies iPad app is a wonderful example of an interactive recipe book. Besides just offering great recipes, it also allows you to search recipes based on ingredients and cookie type to find the perfect cookie for your needs. For example, you might use the app’s search wheel (below) to look for bars and biscotti-type cookies with oatmeal as the main flavor component. This is a great added value because this type of interaction is unmatched in print.
Martha Stewart Cookies App
Paris: DK Eyewitness is probably the most complete travel guide you can find for the iPad. It features beautiful cutaways of buildings that can be explored by tapping and zooming, complete offline maps for all the central districts of the city, interactive city and park walks with “hotspots,” and extensive listings of the best sights relative to your current location. No more searching aimlessly for your location on a map or looking through index pages; the interactive app shows what's around you within walking distance, making the iPad a must-carry on in your travel bag for an experience unparalleled in a traditional travel guides.
Bobo Explores Light is an educational experience for young adults. It puts a fully functional science museum in the palm of your hand, teaching you about lasers, telescopes, lightning, reflection, bioluminescence, and sunlight. This is great example of using simple interactivity to explain relatively complex topics through science experiments that you can actually perform on your iPad. Bobo, a friendly robot, serves as a guide, taking the young reader through space, land, and sea, to learn all about the science of light.
In my book, Timor the Alligator, kids participate in the story by picking toothpaste and helping Timor brush his teeth. This story could not have been told in a printed book because, without the use of interactivity, young kids would not be able to visually understand that brushing actually helps keep a clean mouth. The simple process of choosing a toothbrush, adding toothpaste, and brushing Timor’s teeth until they turn white serves as an educational experience for preschoolers and toddlers reading the book.
With the Numberlys app, kids (and adults) learn about the alphabet through a series of fun interactive games. This book probably has the most spectacular visuals I’ve seen to date. Its aesthetic is inspired by Fritz Lang’s silent film, Metropolis, so the app offers a unique cinematic experience and gameplay to engage users to learn about the (fictitious) "origin of the alphabet."
As you can see from these examples, interactive eBooks are no longer just about a touch-to-animate type of interactivity, nor simply the touch interface controls. Rather, they are about adding value through interactivity by using the full capabilities of a touch device to engage the user and enhance the learning and reading experience. These engaging experiences are what I call a true reinvention of reading.