Showing posts with label Design. Show all posts
Showing posts with label Design. Show all posts

Thursday, December 11, 2008

Ready for Madison Avenue?

When I was in high school, I entertained the idea of a career in art. So many of us at that age have unrealistic opinions of our talents, strengths, and, yes, even weaknesses. Fortunately, I came to realize - before applying to art school - that I had neither the talent nor the discipline for that life.

One of the eye-openers was a class in advertising and commercial design. While I generally earned "A"s in the "fine art" classes, the graphic art course was much more challenging. I could no longer get away with fuzzy edges of my drawings and I had to deal with the preciseness of lettering. This was in the 70s so everything was done by hand.

So, when I was presented with an opportunity to participate in the development of a marketing campaign for a new company, I decided to give the challenges of advertising and commercial design another shot in the digital world.

My approach to this project included:

  1. Creating a proposal for the campaign.

  2. Understanding the company and the audience for the ads.

  3. Developing a theme for the message.

  4. Creating a design.
Getting to Know You

The company's name is kr3c. They're a "think tank" or venture capital group headquartered in Princeton, New Jersey. The first step in this project was understanding the company. What were they planning to do? What problems or initiatives did they intend to work on? Where were they getting their funding? And what did they want to accomplish with their campaign?

kr3c will be working with government and private industry to develop solutions and innovations in technology and industry. Pinning down exactly what they will be working on was not an easy process. Their interests are diverse: from clean energy to screenless computers to education initiatives. The common elements seem to be creative solutions and change. Unlike many of the "think tanks" we hear about on news reports, there appears to be no interest in making public policy or promoting particular agendas.

Funding will be acquired through private investors, grants from foundations, and fees for services - the sale of the "ideas". The purposes of the ad campaign include attracting investors as well as promoting awareness and soliciting clients.

What's It All About?

Designing ads for a concept is a lot more difficult than designing ads for tangible products like clothing, food, or appliances. Tangible products visually speak for themselves. You can dress them up, put them in a certain context to give them "personality". But they can also stand alone and still tell you what they're about.

Concepts are harder to express visually. Since I was working on the print ads, I found this to be pretty tricky. I could go with the "infomercial" type ad. You know the kind. It says "Advertisement" at the top but it resembles an article in the magazine. They must work for some things; there are so many of them. And they certainly would be informative. However, it did not seem like the correct approach.

So, I needed a theme. I decided to focus on change by:

  1. Finding the answers to pressing issues; and

  2. Shaping the future.
I Can See It Now

Before designing the ads, I did a little research.
First, I had to consider design elements. Things like:

  • Layout

  • Proportion

  • Color

  • Typeface
Fortunately, I've been studying design lately so I had easy access to elementary information. One little piece I picked up was the "Rule of Thirds". With the Rule of Thirds, you take the space you're working with and divide it into three equal rows and three equal columns. Important elements should appear on two to four of the intersections of the lines creating the columns and rows.
Colors were determined in part by the marketing team's selection of a logo and the colors of the logos. (One standard logo and one for "green" initiatives. I chose to only use the standard logo but separated out a leaf graphic from the green logo for one ad.)
For layout and typeface, I did a lot of research by leafing through financial magazines and newspapers. The client wanted two magazine ads, two newspaper ads, and two web banners so the layouts, and even the content, would be significantly different.
What I found was a large number of ads with a top-heavy graphic - usually a photo - with a short message and a web link underneath. There were also a number of text ads but they all (but the infomercial variety) had limited, clear text. Newspaper ads were simple, usually text of various sizes. Web banners, due to their size, had limited information with small graphics.
The following are the results:

Magazine Ad


Magazine Ad
Newspaper Ad


Newspaper Ad


Web Banners
Is It Easier The Second Time Around?

I've been asking myself if this was easier than it was back in high school. As far as coming up with ideas and text. A little but not much. Having more life experience, I guess I have more ways to say things than I did back then but finding the ideas is still hard.
As for creating the end product, I have to say "absolutely". I can't say I'm any more creative than I was back then or that I've acquired any talent I didn't have at 17. Creating material on a computer, though, makes all the difference in the world. Having tools to line up images, create straight lines, and create the lettering for me. Wow!

Monday, December 1, 2008

Work with Me!

There are a few things I need to disclose about myself before continuing:
  1. On the Myers-Briggs Personality Type inventory, I am an "INTP" with a very strong emphasis on the "I" which stands for "introverted". I didn't need a test to tell me that. My kindergarten teacher remarked on my report card "Yvonne likes to work on her own." Little has changed since then. This is not a popular thing to admit in a world where, both professionally and academically, collaboration and teamwork are highly valued. Don't get me wrong. I'm a team player and do "play" well with others. Only a few people would call me difficult (and they're mostly family). I can both follow direction and lead. But I'm just much more comfortable (and, admittedly, happier) when I can execute projects on my own.
  2. I love democracy and, in particular, the First Amendment to the Constitution. I abhor censorship. In fact, back in the early 90s I had a second job in a bookstore. The very socially conservative store manager refused to display some particularly controversial titles ("American Psycho" by Bret Easton Ellis and Madonna's racy pictorial essay) even though corporate sent them to us in our weekly shipment. We were under direction to keep them behind the counter and decline to sell them. Despite my personal feelings about the merits of the novel's story or Madonna's artistic integrity, I risked being fired and sold the books. A little stand in the big scheme of things but a stand none-the-less.
  3. I do not believe that it takes a degree or formal education to be knowledgeable or to read and interpret scientific or academic material. In fact, I know plenty of people with lots of schooling who I feel know or understand very little and vice versa.
With those disclosures out of the way, I think I'd like to say something about on-line collaboration and, in particular, "wikis".
How Many Design Students Does It Take to Make a Wiki?
I alluded to this a few entries ago - October 29th to be exact. The whole idea of the democratization of knowledge and "expertise" bothers me a bit. I wonder what impact it will have on our culture. Aside from the possibility that it could provide a new spin on the "how many - insert here - does it take to replace a light bulb?" jokes. Had I been better prepared, I would have sought out articles on this. (The articles on the possible effects, not the jokes.) I'm sure they're there. But I think I'd rather rely here on my own recent experiences with this relatively new phenomenon.
Last month I worked on two projects simultaneously that involved wikis. For one, I was given the task of entering the world of Wikipedia - probably the most popular wiki - to either edit or create an entry. The other project involved working with fellow design students on creating a wiki on the elements of design.
Little Fish in a Big Sea
Entering Wikipedia was a bit intimidating. First, there appear to be all of these rules about style, content, format. Unfortunately, I found their "help" pages extremely difficult to use and confusing. (I needed a book but didn't discover until later that one was available.) Once I got past that, determining what to edit or add was a very daunting process. There are I don't know how many entries on Wikipedia and I don't really feel I qualify as an expert on anything in particular. After a lot of deliberation and failed attempts to find a topic I could add value to, I chose to add a new entry - one on "pediatric spaying and neutering" of puppies and kittens(spay/neuter is performed on puppies and kittens as young as 6 weeks old and up to the standard age of 4 to 6 months old). Of course, a new entry appealed to the INTP in me!
Okay. I am not a vet nor do I play one on TV. However, I do have some knowledge and experience that your average animal lover does not. I served as the vice president of a non-profit animal shelter in South Jersey for 6 years in the 90s. That shelter has a spay/neuter clinic. And, as it happens, they were testing out "early" spay/neuter in the clinic when I was on their board. When it came to instituting a policy regarding this practice, I felt it was my responsibility to understand the pros and cons before voting on it and did some research - mostly reading the little bit of scientific literature that was available and talking to the clinic manager. Over the years since then, it's a topic I've followed with interest. As luck might have it, pediatric spay/neuter was not addressed on Wikipedia.
In preparation, I spent many hours researching the topic and seeking out balanced articles supported by reputable studies. I wrote the article, struggled through the cumbersome posting process, and, voila, "published" an article on Wikipedia. It was no easy feat. And, in all honesty, I felt very much like an impostor doing it. Who was I, a person who was not especially good at biology and who was not a veterinarian, to post this kind of material for all of the world to read? I was careful with my research but...was I the appropriate person to do this?
Well, my concerns about the legitimacy of my claims to expertise all vanished the next day when, to my shock and dismay, my page had vanished. It seems that one of the self-imposed editors (or maybe an officially appointed monitor - who knows since it all appears to be anonymous) had "redirected" my article to one simply titled "Neutering". The result of "redirecting" is that the content disappears from public view. I had seen this other article. It was, I thought, long and included information beyond the dog and cat topic of my interest. It seemed to me to be a disservice to both the information already there and the information I intended to provide to combine them on one entry. Apparently, the anonymous "redundancy police" did not take the time to review both posts to see how the new post had distinct information. Had they read it, they might have just moved it to the "Neutering" entry.
I panicked. Not only had I put a lot of time into this project, I had a grade for a class riding on the fact that I actually did something. Plus, I felt by this point that I did have something important to say. Through some trial and error (again, the instructions were not particularly helpful to me), I discovered that I could undo the "redirect" - so I did. And I added a comment imploring the would be "editors" to allow the entry to remain and pointed out the distinctions in the content. To my relief, the posting is still there. You can view it at: http://en.wikipedia.org/wiki/Pediatric_spaying. I'm hoping that on my winter break from school I can return to complete the information requested by the "style police".
While this dispute was resolved civilly, I'm not sure all are. That's inferred in some of the guidelines about resolving disagreements. Rules seem to be applied inconsistently. For instance, one classmate posted an informational piece about his real estate business. It was deleted as a purely "commercial" post. But another person in class modified a post about an AT&T or Motorola product that, to me, appeared to be blatantly commercial.
Like political democracy, it appears that informational democracy can get messy. I wonder how very unpopular topics are handled. How far can you go...really? And who has the final say on what's a legitimate post and what is not? Is every piece fact-checked by someone? And is the fact-checker qualified to make the call?
In my classes, Wikipedia entries are often used to provide definitions or examples of terms. I'm certain my professors know a good, accurate post when they see one so I'm not questioning their judgement. But what about the person who is looking on her own and just searching for enlightenment? Since posts are anonymous, how do we know we're not buying snake oil when we use the entries? I get a queasy feeling about the possibility of students - particularly elementary and high school students - using the entries as sources for research papers. How can a user be certain he's not using the equivalent of an op-ed piece as a research source? Sure, anyone can post on the Internet. Just go to Google Sites and create a free web page. You can say whatever you want and present it as fact. In fact, that was an exercise in one class - to determine the legitimacy of information posted to appear as factual information. My concern is, though, that the organization and formality of Wikipedia implies a certain level of trustworthiness. It looks and feels institutionalized. Official.
I still can't get past the question of who is the final arbiter in this process. I worry about the tyranny of the majority. One of my favorite movie lines is from "Men in Black". Tommy Lee Jones' character says to Will Smith's character:
1500 years ago, everybody knew that the Earth was the center of the universe. 500 years ago, everybody knew that the Earth was flat. And 15 minutes ago, you knew that humans were alone on this planet. Imagine what you'll know tomorrow.
Those new ideas are often squelched when they are unpopular. How many unique ideas have been or will be deleted from Wikipedia because the majority feel they're unsupported or inaccurate?
Let's Get Together
My other class took on a less visible but equally challenging project - creating a wiki in Wikispaces. Our task was to each take an element of design and create an original page to define and illustrate it. I found the Wikispaces tool much easier to use than Wikipedia. And knowing that some unknown person would not come along and delete everything was comforting. But I will say that it was challenging.
After posting our initial pages, our goal was for each of us to provide at least one edit to each of the other students' pages. Some of the pages were exceptional. It was difficult to find ways to improve the material. I felt I was being intrusive. On the other hand, some pages seemed to have incomplete or inaccurate information. They were easier to update. Some of the errors were not obvious. Had I not felt compelled to look further to outside sources (the INTP in me), I would not have known for sure. And at least one "enhancement" made after I was done my edits (and after the site was locked for grading) was, to my dismay, inaccurate. A sample of an analogous color scheme was used as an example of a complementary color scheme. In fact, after looking back at it, the complementary color chart seems to be incorrect as well!
Many great edits were made to my original page. I had a difficult topic with very little available information in the on-line tutorials and articles. "Format and Orientation". Not as sexy as "color" or "proportion". While I felt I made a good start, the class critiques were a little more...critical. This is where putting the ego aside is useful.
I do believe that the pages overall were improved by the collaborative efforts. The page I started is a good example. However, knowing the errors I found, I am leery of the accuracy of some of the material. Questions remain. Did the authors use good sources? Did they understand the information well enough to interpret it? That brings me back to the impostor complex I had with my Wikipedia experience. Do we know what we don't know? Are we fully aware of our lack of understanding of certain concepts or our misinterpretation of them? From some of the material, I don't think we do. It makes me wonder what I may have misstated on the Wikipedia entry. Or in the design entry for that matter.
As for who had the final say in what was correct on our project, it seems to have been the last person to edit a page. Is that a good way to approach a wiki or other collaborative effort in, say, a business environment? Or do you have one person with responsibility for ensuring accuracy, completeness, and compliance with standards?
Now What?
So, now that I've expressed my anxieties about these collaborative efforts, what do we do about it? Are these reasons to turn our backs on wikis? Do we censor those without credentials from talking like experts in a public forum that could be mistaken for a reputable source of information? Or do we, maybe, encourage the inclusion of disclaimers - more obvious, bold disclaimers - that the material is from "common folk - just like us"? Maybe we encourage revelation of the authors and their credentials - if they have any.
It could be argued that there's no real risk here. Anyone can write a book with inaccurate information. Publish a newsletter. Create a video. Write a memo. These items can provide misinformation, lies, half-truths. Sure they can. But it's a whole lot harder (costlier...more time consuming) to get those thing out and circulated. My little article or my class' wiki project could be seen by billions of people in an instant at no or little cost. There's a lot of power in that. And, as Spiderman learned, "With great power comes great responsibility."

Wednesday, November 26, 2008

I Get By with a Little Help from My Tools

There is a risk that I might never see the sunshine again. I just discovered the "tablets" that attach to a computer to help the user create and manipulate graphics. They have a pad that works like a drawing board and an inkless pen that's really just another kind of mouse. Between the software that can morph my photos into "paintings" and the freestyle drawing and "painting" capabilities with the pen, I'm in heaven.

I sought out this tool as a practical matter. I wanted to create some personalized banners and other graphics for my blog, websites, and various documentation projects. Using a regular mouse to "paint" was, well, like serving soup with a bridal veil. It was just a plain mess! On top of the visual aspect, my repetitive stress injuries flared up like a bonfire. I see the purchase as an investment in my sanity and physical well-being.

It comes at a very good time, too. This new device is a great distraction from my job concerns. You see, I work for a financial arm of one of the big three American automakers...and we have not had a good week. In addition to worrying about just having a job, I have to apologize for the cluelessness of the people at the top of my food chain. It's embarrassing, actually. I walk around with dark glasses, a scarf, and a trench coat in hopes that no one will recognize me.

It's not like I didn't try to counsel them early on. For years, whenever they posted an announcement on our company intranet about one of the new overpriced, gas-guzzling, ozone depleting, carbon-spewing monstrosities in their line-up, I would post in our discussion forum a request for more compact cars with high mileage...an American version of the Prius, Honda Civic hybrid, or, dear heart be still, the Insight with 50+ miles per gallon. Their response would be a short blurb about the company investing in fuel cell technology...something that certainly won't be viable in the near future.

And I identified a need for a reality check when the CEO visited our small corporate offices in Pennsylvania a few years ago. As we saw co-workers going through the first of what turned out to be many lay-offs, this gentleman talked to us about the need to purchase the company's vehicles. He regaled us with a story about how his kids were just turning driving age. With all of the new cars he was buying to satisfy their transportation needs, he was running out of room and trying desperately to purchase his neighbor's property for the garage space. We were to empathize with him. I notified my managers of the necessity to provide this manager with some sensitivity training. Apparently, no one in Detroit received my message.

So, I immerse myself in things that keep me off of www.bloomberg.com and the Wall Street Journal site and from fretting over things I cannot control. These distractions include seeking out new opportunities and learning new skills.

Notice Anything Different?

First order of business was to redesign my blog. This blog was my very first attempt at blogging. When I set it up, I used a Blogger template and made a few changes that were facilitated by the functions in the Layout and Settings options. It was okay. I liked the green but I felt restricted by the template.

Let's compare. Here's a shot of the site on the first day:


While you can see what it looks like now, it will probably look different months from now. So here is a shot of the current view:


It's Not Just About My Opposable Thumbs

I started the redesign with a Blogger template (one called "Stretch Denim"). But the template was not quite the look I wanted.

To take it further meant learning how to use new tools. As I discussed above, I acquired a "tablet" to work on graphics. The tablet came with Adobe Photoshop Elements 6.0 and Corel Painter Essentials 4.0. Lightweight tools, I'm sure, for serious graphic artists but these are good beginnings for me.

For the banner, I created a rectangle and filled it with a gradient palette offered in Photoshop. The photograph is from a trip to Casa Loma in Toronto this past summer. Some cropping along with contrast, saturation, and highlighting adjustments in Photoshop gave it a new life to symbolize traveling a path - walking through a process, an experience, life in general.

The other tool I'm excited about is html - Hypertext Markup Language. When I talk to my S.O. ("significant other") about it, he looks at me sideways and tells me that my enthusiasm for html is further evidence that I am not cool and have no hope of ever being cool. But I don't care. Because, with practice and some more time working on my design sensibilities, I can use html to make my web material look great. While I could make a lot of the changes I wanted using the Blogger check boxes, there were some that I could not.

For instance, take a look at the statement in the banner. The heading is an ivory color while the mission is a dark blue. Blogger defaults to making both sets of text the same color. By adding just a little bit of html code, I was able to assign a different color to the mission.


I also had issues with the margin of the text in the banner. Blogger doesn't provide any tools to adjust margins. The text appeared over the image when I first added the banner. A couple of changes to the html code and I had this lovely left margin politely off to the side of the image.

Keeping It Clean

Other aspects of my redesign involved removing excess color. I've decided, after a lot of critical review of web sites and blogs, that I much prefer light or white backgrounds for text. Bold color is good when the site consists of primarily graphics. But a heavily text populated blog like mine needs more light colors. Plus, the big green margins on either side of the old design took up too much space and made each blog entry seem interminably long.

I kept the typeface simple - substituting Verdana for a serif font throughout the body but using Georgia for the top header to make it stand out. I may substitute another color for the green I used for visited links and dates. It could be a little hard to see.

I'd Like to Thank My ...

I received some very helpful direction from my design professor and classmates at NJIT but not everyone has access to them. (Too bad for you!) I also got a lot of useful information from:
  • The wonderful tutorial that came with my tablet (a Wacom Bamboo Fun tablet). I was surprised at how helpful and thorough it was.
  • A book called "Sams Teach Yourself HTML in 10 Minutes". It was amazingly helpful and broke out the lessons in easy to manage chunks. It has a prime spot next to my computer now.
For now, I'll look for some vitamin D fortified soy milk and force myself to take a walk a few times a week. Now that this door is open, I'm in real danger of becoming a hermit.

Thursday, November 20, 2008

What Am I Supposed to Do About This...?

Possums are stubborn creatures. Most animals caught in a humane trap want nothing more than to get out and run when you open the door. Possums are not so eager. In fact, I've had to lift a trap, turn it upside down, and shake it until the little guy loses his grip on the metal mesh-like sides and tumbles to the ground. I'm not sure why they're reluctant to leave. It could be they somehow feel safer there. Or it could be that they figure there was food there so it must be a good place to hang out until more food arrives. Kind of like the reverse of an automat - instead of pulling the food out of a box, you walk into the box and wait for the food to be put in.

Catching wild animals like possums and raccoons is one of the risks of trapping feral or free roaming cats. I've caught my share over the years. It's a little unnerving the first few times. What do you do? Fortunately, I knew a few wildlife rehabilitators and only had to make a couple of calls to get rational and safe instructions. But most people don't have those resources or know where to start. In fact, most people who want to help stray cats don't know where or how to begin.

So, a few months ago, a friend approached me about developing resources for people who want to do something about the feral or stray cats in their midst. After doing some research and pulling together some materials, I started a website - kind of a "do it yourself" guide for people new to this world.

Why a Website?I decided to use a website for a few reasons:
  1. The material can be accessed immediately...provided the person looking for help has computer and Internet access.
  2. There's no postage or printing expense to get the information to the people in need of it.
  3. The information can be updated quickly and without the waste of tossing outdated printed materials.
  4. Audio-video material can be provided at a much lower cost than sending out video cassettes, Cds, or DVDs.
  5. We can always print out material for people who don't have Internet access.
I see two main drawbacks to using a website:
  1. We lose the personal contact that we would otherwise have if they had to ask us directly for the information. Sometimes it is useful to talk to people to prevent them from undertaking unnecessary or ill-advised actions.
  2. It can be difficult to effectively format extensive, detailed material for web use, especially for older users. I believe this is the reason that so many paper manuals still pop up in the workplace. More on formatting below.
Getting Started

There are actually a lot of sites out there with information on helping cats. Most are focused on "TNR" or trap-neuter-return. They link to either national groups or groups in geographic areas outside of ours for support. While I don't want to reinvent the wheel, I think we can improve on the available material with better visuals and formatting; in addition, we're providing links to resources local to our area and information beyond TNR. After all, not all cats in need are feral.

What I've posted so far is very basic. Just a start, really. No useful visuals - yet. And the formatting could use improvement. My plan is to approach the design as a technical writer, making it easier for visitors to find the material they need and understand it. While I develop the site, I need to keep these five things in mind:
  1. Audience
  2. Components
  3. Meaningful descriptions
  4. Effective visuals
  5. Format and organization
Audience

Who is my audience? What will they do with this information? How detailed do we need to get? And what type of language should we use?

It's essential to determine these things before starting out. Typically the person writing instructions has experience and knows the process. But how familiar is the reader with the process, tools, or terms often used by experienced people? Can I use words like "feral" and terms like "TNR"? Can I just say "set the trap" without explaining what a humane trap is, where to get one, or how to set it up?

I've already determined that I'm writing for people who haven't done this before. Sure, we might get visitors who know the routine and are just looking for the local resources. But our primary intent is to have a site to which we can direct people looking for help. They will use this site to help them make decisions and take actions to help the cats. We'll have to take time and explain the difference between "feral" and "stray" and how to make those determinations. Instructions will need to be thorough and detailed. "Set the trap" won't cut it. We'll need to take time to explain what a humane trap is, what the parts are, and how to set it. We will concentrate a lot on detail and concise language.

Components

In a technical document that accompanies a tool or appliance, components refer to the structural components - or actual physical parts - and functional components- or tasks and operations in the use of the tool or appliance. The audience determines what components you describe and how you describe them.

Components on my website consist of the tools used to help cats and the processes - with a heavy emphasis on processes. Step one - assess the situation. Step two - prepare to trap the cat. And so on. Because our visitors are inexperienced, we will - eventually - describe the steps in detail. Alley Cat Allies does a good job of this on their site:

Click on image to view text.

Meaningful Descriptions

Language used must be verifiable and precise as well as appropriate for the audience. Use of carefully chosen accurate terms and figurative illustrations help make the information meaningful to the reader. Defining the audience, as described above, guides the author.

In the examples I provided under Audience, I will want to define the term "feral"- probably with a link to a pop-up definition - because many of our visitors will not know what distinguishes a feral cat from a stray cat. Parts of the trap, such as the trip plate, will be described. For instance:
The trip plate is the flat, rectangular metal piece on the floor of the trap at the opposite end from the trap door. When the trap is set, the trip plate is elevated just slightly at an angle. When the cat steps on the trip plate, he pushes it down pulling on the lever which releases the trap door.
Again, we will need a lot of detail with plain language to make this site useful.

Visuals

Visuals can make nearly any instructional material so much more meaningful than words alone. They can show the reader what an object looks like inside and out, in its entirety or just part of it. They can be used to clarify descriptions, show relationships in size or proportion, illustrate relationships, or demonstrate hard to describe concepts. Photographs, diagrams, illustrations, charts, models, and videos can all be used to support the text.

This is where many of the sites I visited (my own included) fall short. Too few illustrations. While the Feral Cat Coalition's website provides some wonderful information, it's all text:

Click on image to view text.

Others, like mine again, include lovely pictures of cats. Some even have photos of cats in traps like Cat Snip:

Click on image to view text.

While Alley Cat Allies' site has very few visuals with the text, they do have a couple of slide shows and one very useful video:



Click on arrow to view video.
I will add illustrations of traps, photographs, and, I hope, video to supplement the text on our site.


Format and Organization

Instructional information is typically provided in some kind of sequence based on the needs and expectations of the audience. It can be organized in:
  • Spatial order - where components are located in relation to one another; describes appearance and structure. An example might be a description of the different components of a humane trap.
  • Chronological order - a sequence of events in time; describes steps in order of when they are performed. This could be something high level like
"Step one: Assess situation. Step two: Plan to trap. Step three: Set trap."
or something more detailed like

"Step one: Push lever in front of trap door and squeeze against door. Step two: While still squeezing, lift trap door so it is flush with the top of the trap."
  • Priority order - describes components in order of importance. On our site, this might be characteristics for determining that a cat is feral.
How to present information on-line is challenging. Too many sites treat the screen as if it is a paper page. Organizing instructional material on the web so that it is easy to read as well as easy to access can be difficult. Clicking from one page to another to access next steps can annoy users. However, pages with a lot of text are visually unappealing, can take a long time to load (especially if there are a lot of graphics and the visitor has an older computer), and make specific information difficult to find.

I'm a fan of Information Mapping, also called Structured Writing, in my paper documentation. Attempting to adapt that format to web delivery (without the expensive training) has been on my to-do list for some time. In the meantime, I will seek out well-structured "how-to" sites.

Another option is to provide high-level information on the site with links to more detailed documents in .pdf or .doc format. This may be useful but could prove problematic for visitors without the appropriate software. Some users don't know how to find or download the necessary tools to open these attachments; others may be wary about downloading anything for fear of viruses.

Next Steps

So, the to-do list gets longer. While I know our audience, I need to concentrate on:
  • Providing more information overall.
  • Descriptive, concise language appropriate for my audience - including definitions.
  • Adding meaningful graphics.
  • Ensuring that I use the appropriate order for each description.
  • Creating downloadable documents.
  • Formatting the site so it is easy to use.
  • And, lest I forget, adding instructions on dealing with those darn possums when they won't leave the trap!
Lots to do. But, it's for the cats so I can't complain.

Wednesday, November 5, 2008

Just Having a Little Fun

"Some people have too much time on their hands."

Working in the grown-up - read "stodgy" - world of banking, I can guaranty I'll hear that from at least one person when someone passes around a clever, but unproductive, little virtual toy. You know what I mean. The little file or web link that, when you open it up, a rabbit sings or appropriately placed clicks allow you to hit an elf over the head with mallet. Or it could be something that just opens up and looks pretty with sudden bursts of color that morph into different flowers or psychedelic swirls.

Note to employer: Of course, I would never use company resources to circulate that nonsense.

It makes me sad to hear those remarks. I worry about those people. Is it that they just can't have fun? Are they oblivious to the creativity, thought, and skills that are involved in these designs? Or are they just jealous of the people out there who have the creativity and, yes, the time to create these little marvels?

The Biggest Toy Store

When it comes to finding these morsels of entertainment, the Internet is like a huge toy store. Flash websites are like the toys from FAO Schwarz - pricey and desirable. "Flash" is short for Adobe Flash, the tool used to create them.

Some Flash sites are strictly for entertainment. Others are used for commercial purposes. Either can be equally fun or enjoyable.

And, no, Flash isn't used strictly for the entertaining stuff. I'm sure there are many mind-numbingly boring Flash sites out there. But what fun is it to talk about them?

I was recently introduced to some samples of the entertaining or interesting variety. I had a hard time picking a favorite but I think I have to go with this Converse site at: http://www.converserussia.ru/.

Do Not Adjust Your Set

With all of the samples to choose from, why this one? Terry Gilliam. The visuals remind me of his animation from Monty Python's Flying Circus. I love Gilliam's animation. But why does it work?
  • Images - The images are interesting. The whole bizarre collage effect of unrelated images pasted together gives the viewer something to look at. There's a quirky sense of humor - the Russian doll with the mismatched male basketball players' legs, the vine with the megaphone, the basketball player with the winged fur hat (or is that an afro?).
  • Animation - While this site has fewer moving parts than some of the other sites, it still provides interest. The constantly moving images are minimal and not terribly distracting. For the viewer who moves the cursor around a bit and tries clicking here and there, there are some surprises. I particularly like the wire connecting the large high-tops.
  • Color - With collaged images, there are so many mistakes you can make with color. Florescents with earth tones just don't work. The designer(s) at this site kept the colors muted, with more earthy tones overall. They give the feel that all of the pieces are old. It pulls the disparate pieces together.
  • Sound - The music is interesting and sounds like it was pieced together just like the images. If it starts to get on your nerves, there's a little icon you can click on to turn it off.
  • Text - There's minimal text - most of it's part of the design. Or, I think it is. A lot of it's in Russian and I'm not bilingual so...
  • Format and Layout - The images just go slightly beyond the limits of your computer screen. But that's part of the animation. As you move the cursor to the edge that is out of sight, the screen appears to move left or right, up or down.

More Fun...for Those with Too Much Time on Their Hands

I liked these other sites, too:

www.foratthastargerallt.se/kampanj/ - For horse lovers! Gorgeous!

http://lab.mathieu-badimon.com/ - Entertaining but not a high addiction risk.

www.mono-1.com/monoface/main.html - Warning: Can be very addictive!

Tuesday, October 21, 2008

Why Don't You Just Pull Over and Ask for Directions?

That's a frequent complaint of my passengers. If I can't find my way with a map, I'm determined to find my way by intuition. Fact be told, I actually enjoy getting lost. Unless I'm really late. Or I'm in a bad neighborhood. But, in general, it's usually an adventure. I find things I'm not expecting.

That's true for me on the web, too. I start out with a general idea of what I'm looking for, get lost, and discover all sorts of new and interesting material. The problem is, that takes up so much of my time. And I'm starting to suffer from information overload. There's way too much information out there to sift through. It can be a bit ovewhelming.

Can I Get a Referral?

When I'm looking for someplace to eat in a strange city, I often ask a friend or go to a guide book to find something interesting. Being a vegetarian, my options are often limited so getting information from someone who's been there is useful.

The same can be said for traveling that "information highway". We often share links via e-mails. Now we can share them via "social networks". I recently joined "Delicious". (Sounds decadent, doesn't it?) I can bookmark sites I find interesting and share those bookmarks with you. In fact, here's a link to my bookmarks: My Bookmarks (Hey, I tried to insert the "badge" like the Delicious instructions told me to but it just didn't work!)

By "joining" another person's network, you have access to real-time updates. This method of sharing has potential in the classroom as well as the office (or wherever your workplace might be). Teachers can easily share approved sources of material with their students or useful homework sites with parents. In the workplace, you can similiarly share important (or amusing) material without having to send out e-mails or update web sites.

Is It Behind Door Number 1? Or Door Number 2?...

I chose a variety of links to help me learn a little more about how do so some things on the computer (like record audio, use CSS, and create a web page), refresh my policies and procedures skills (with a link to Information Mapping), and to remember an enjoyable class assignment (the short video on the history of Copper Black typeset). As I build up my collection of bookmarks, I'll need some way to keep them organized or they'll be nothing more than a long list of links.

The organization of these bookmarks can be helped with "Folksonomy" - a word not quite in Webster's yet, I'm sure. It generally means the method of labeling bookmarks, photographs, and other material found on the web using key words. Some consider it to be a very democratic process. However, there are generally no conventions so it's a free-for-all, even anarchical. A librarian's nightmare!

Why is this important? Because you also share the tags. Now, I may understand that the tag "Saturday Night Entertainment" means pictures of the night we pulled out the laser pointer and exercised the cats. Someone else might have a completely different interpretation. And, because anybody can place any link under any tag and identify it with any name, you never know where you're going until you get there.

Which can be make life interesting. Just make sure those parental controls are still set...







Monday, October 6, 2008

At Least It's Not My Writing...

Some things you're just happier not knowing. I recently read an article about using typefaces. Most people probably know them as "fonts"...the various styles of the characters on your computer keyboard such as Arial, Lucida Grande, Trebuchet, or Verdana.

The article is entitled "Avoiding Typeface Terrors" by Kathleen Burke Yoshida. It is interesting material. (Well, it is if you create documentation for a living.) And, I found it very helpful. But it also put me in the position of having to make a change to my documentation approach.
Righting a Wrong
You see, it seems as though I've been using the wrong typeface for my policies and procedures and training documentation for years. I like Arial. It's clean. No fuss. Just like I try to write my documentation.

However, according to the article, Arial's lack of "
serif" - or the little feet or protrusions from the lines as highlighted on the "T" to the right - makes it harder for the reader to follow the text; the reader finds it difficult to continue through the many lines of words without the little feet to lead the way.

So, where does that leave me? You might say it's easy. Just use the Microsoft default -
Times New Roman. The problem is a little print related PTSD. Times New Roman and the lighter, wider Courier bring with them the baggage from my beginning years in banking.

It was in the early Reagan years and I unexpectedly found myself in an office job where I had to type...using a typewriter! Now, I took typing in high school so I could type my own college term papers. I didn't do well in the class - too slow with too many mistakes. But I could get by well enough to pull together a legible (if not smudged) paper on an old 1940s manual typewriter.

My job, however, had me typing legal documents - Notes and Mortgages - and mistakes were not permitted. The worst was the Mortgages. Each Mortgage includes a property description which basically defines the perimeter of the property. A nice rectangular property can be a short five lines. But an odd shaped property, especially in a rural area where landmarks are tree stumps and the intersections of neighbors' lots, can go on for pages. I could spend hours on one Mortgage.

Times New Roman and many of the other "with serif" typefaces remind me too much of the typeface used on the typewriter. I have my own "emotional" response to the little feet. Plus, I think it looks cluttered.
The Search
I want to do right by my readers so I'm in search of a new typeface. Normally, I really enjoy selecting typeface...when I have the opportunity. It's usually for a flyer or other material related to my volunteer activities. I can actually spend more time selecting the typeface than drafting the text. It can be fun. There are so many options. I recently discovered that there's quite a business in creating and selling typefaces. One site I came across (http://www.veer.com/) sells some amazing, interesting typefaces for $40 to $100. Not that I'm interested in spending $40 on a new typeface.
This search, though, leaves me with little opportunity for fun and creativity. There are rules and limitations.

  • First, it must be readily available in Microsoft Office.
  • Second, it must be legible.
  • Third, it must be readable.
  • Fourth, any "personality" it has must be professional.
After scrolling through the selections in Microsoft Word, I think I'm going to give Century a try. Here's what I like about Century:

  • It's open and round. The letters are not pressed together.
  • It's not heavy. There aren't a lot of thick lines.
  • Of the typefaces with serifs, Century is one of the cleanest. The feet are more like size 6 rather than size 9.
The down side to the openness is that it might take up more space potentially adding additional pages to each document.

Testing the Typeface

The question is, does it pass the tests outlined above?
  • Available in Microsoft Office: I found this in the list of available fonts and I have not added any to my computer. I also know it's available on my computer at work. Pass.
  • Legible: To test legibility, Ms. Yoshida suggests that you "place a piece of paper over the top or bottom half of a word or sentence. If you can read the word or sentence easily by just looking at half of the letters, then the typeface is likely to be perceived as legible." Pass.


  • Readability: The type size is easy to read and it has the obligatory serifs. Ms. Yoshida says to look for a large "x-height" meaning the body of the characters (the portion above the line that does not extend above the top of a lower case "x") is larger than the "ascenders" (the parts above the top of the "x") and the "descenders" (the parts below the line). Pass.

  • Personality: The personality of Century is not quite as formal as some of the other serif typefaces. But it's not casual. Because this typeface will be used for documentation that must be viewed as credible and must be taken seriously, it's important that it is not too informal. My opinion is that it passes but I think it requires a test drive from some discerning eyes.
Wish me luck!

Tuesday, September 23, 2008

Made Ya' Look!

Design! Sigh...a personal confession here. I lust after the skills of a graphic artist. Sure, I can draw a picture of a house and it looks like a house. And not just a child-like representation - there's perspective and scale and detail that's representational. But the level of creativity involved in graphic art eludes me. I guess I'm just a literal kind of gal. When I draw a picture, I feel compelled to put the image on paper just as I see the subject. I have difficulty with distortion, vagueness, and illusion. It's sad.

There is, however, hope for me with graphic design. During my educational journey at NJIT, I am looking forward to developing my skills in graphic design. I doubt I'll ever be ready for the MOMA or Madison Avenue, but I hope to conquer the art of creating a visually appealing page...actually, many visually appealing pages. So, it's with considerable interest that I explore the elements and language of design through the use of typography.

Organic Letters

The following video is an interesting example of typography in design. It uses text, which is manufactured or mechanical, to create an image of something organic. Take a minute (okay, a little more than a minute) to view the video.



Elements of Design

There are several interesting aspects to this design. The format is very simple. It starts with a blank white screen with no borders (other than the edge of your screen and the control bar at the bottom). A row of text floats to the top and off of the screen as a guide or introduction of things to come. An asymmetrical design is then built from the bottom. It doesn't just shoot straight up. It moves up and across, drawing your eyes toward the top of the page and to one side or the other. Some of the text floats horizontally up in rows while other text climbs in columns that fall slightly into a lower position in a sinewy form as it collapses.

As the text compresses, drops, and fades, it morphs into the form of a tree. As would be appropriate for a tree, the figure is grounded at the bottom of the screen. Were it in the middle of the screen, or even a few centimeters from the bottom, it would look like it was floating in mid-air - an unnatural state for a tree. The lack of borders on the sides or top reflects the natural world; it creates a sense of openness.

The tree figure is created in a form described as "incomplete closure". The lines insinuate the form of a tree. Not every line is connected. Not every shape is fully formed. The contrast in the image comes mostly from the text against the white background.

The content of the text seems to be secondary to the overall design of the image. It's difficult to read as it moves across the screen and compresses; and, in parts, it's blurred. It appears to be a list of authors or artists. The theme could be growth through art. I was unable to find an interpretation from the artist. It would be interesting to know what he had in mind.

Language of Design

The design "speaks" to us using a vocabulary of visual elements. As I noted earlier, the image is asymmetrical. It's organic or natural, not controlled. Outside of an arboretum, deciduous trees, like the one depicted in the video, are rarely symmetrical. The colors are earth tones - mostly green and brown with some yellow and just a hint of red to create the contrast of complementary colors.

More organic elements are found in the lines. As the columns of text rise, twist, collapse, and fall, they morph into sinewy lines representing branches. Rows of text rise horizontally and stay straight across. As the image builds, the straight lines of text create the leaves. The random lengths of each line and the position of the text as it stacks one line on another define the crown of the tree. The text creates an edge, separating the tree from the sky, without drawing lines. It might be counterintuitive to have straight lines (something that appears mechanical) in an organic design. But the rhythm of the text creates an organic feel. Had the video continued, the negative space could have helped define volume for the crown of the tree.

Next Steps

Good design draws you in for a closer look. When you're creating any form of visual communication, it's imperative to capture your reader's attention. On a website or blog, good design is critical. There's so much out there whetting the reader's visual appetite. The competition is strong. I need to step things up a bit on this blog. I would like to take the things I'm learning (and relearning) about design and apply them here.

Ah, but first I have to figure out how to use the tools. This is when I yearn for a big paper user's manual. I know...blasphemy!

Wednesday, September 17, 2008

“Trix Are for Kids…”

I remember the hyperactive cartoon rabbit bouncing around the television screen of my youth like it was yesterday. The happy, colorful commercials appealed to the younger set and convinced them to beg for sugary breakfast cereal.

I also remember Yule Gibbons. (He reminded me of my mother's eccentric uncle who "lived off the land" eating weeds and any small crop that would grow amongst the weeds.) Mr. Gibbons was hawking Grape Nuts. His commercials were more sedate, sometimes clever, appealing to the adults in the audience. Website designers may also take the different approaches when designing content to appeal to different age groups. We can take a look at two examples: The Cancer Project and PBS Kids.

The Cancer Project

The Cancer Project is an informational site sponsored by the Physicians Committee for Responsible Medicine (PCRM). It’s part of an educational project to promote dietary changes to prevent cancer.

The site is clean and well organized. The colors are reserved with just a pop of primary colors here and there on the home page. Graphics are limited. The design choices are appropriate considering the serious nature of the topic. Some visitors to this site may be dealing with the illness personally or through someone close to them. The content appears to be generally geared toward the lay person interested in cancer and prevention. Medical terms are simple but assume some knowledge of health issues. PCRM has another website targeted more at the medical community so there is little need to address them on this site.


Pictures and simple menus help the user navigate through the site easily. This is good for the visual and sequential learners among us. While primarily in English, there is one link that directs the user in Spanish to Spanish language material.

The Diet and Cancer page of the site provides categories of information related to research. The development of this page most likely included a compilation (through surveys or focus groups) of common questions regarding cancer and diet. Those questions where then grouped into categories that represent a common theme in the questions. For instance, basic information about cancer and its relationship to diet are grouped under Cancer Facts.


Selecting a topic from the category brings up a short article explaining the research and findings.



There is very little for the action oriented person to do on this site. There are drop down menus for a little bit of movement. And, for off-line adventures, there are recipes.
Overall, this is a very verbal website – mostly text – which could cost them some readers who are more visually inclined and like graphics. No accommodations are made here for the visually impaired; the addition of audio options would be useful.

PBS Kids

PBS Kids is a blast of color when you first enter. Content on the home page is heavy on graphics with minimal text. From the design, I assume that they are accommodating the youngest visitors who may not know how to read yet. They may not be able to make out the words on the screen but they can certainly recognize their favorite PBS characters.


And you can’t hear this here but, when you move the cursor over the child-oriented links on the page, an enthusiastic child announces the option. This is yet another way to allow non-readers to navigate the sight. Clicking on the arrows spins the wheel in the center like a wheel of chance on the Boardwalk! It’s a very fun, active site which appeals to young children. Interestingly, the links for parents and teachers do not come with the same, excited audio announcements.

I happen to like Mr. Rogers so I selected his show from the wheel. His page is also bright and simple. There’s no audio on this page (or, as it turns out, on the Sesame Street page). So, those non-readers may need a little help if they don’t understand what the icons at the top stand for.



But, when you enter Mr. Rogers’ house, the fun starts again with moving doors and simple sounds as you move the cursor around. The primary elements on the screen, like the bag on the table or the trolley, link to new pages with activities kids can do off-line or even more moving elements triggered by your cursor and clicks.




Children learn quickly by doing. And there’s lots to do on the PBS Kids site. Surprisingly, I did not notice any links to material in languages other than English. This limits the audience to English speakers. And, there is little here for the visually impaired child.

To reach the widest range of viewers, a website should have a variety of elements to appeal to people with different learning styles and abilities. It’s a difficult thing to balance. And, with both sites being funded by non-profit organizations, there are budgetary limitations. Both sites, however, do a great job of making the material accessible to the targeted age groups.








Monday, September 8, 2008

Different Perspectives

In an effort to examine corporate blogs, it might be interesting to approach it from two different perspectives: the profit corporation versus the non-profit corporation. And, I thought, who could be more different in those two worlds than McDonald’s and PETA?

McDonald’s
Who doesn’t know McDonald’s? The Golden Arches. Big Mac and fries.

The purpose of their site as it appears in their masthead is to address:
Corporate social responsibility through the eyes of Vice President, Bob Langert, and the other people at McDonald's who work on corporate responsibility issues that matter. Get personal perspectives on the issues, hear open assessments of the challenges we face, and engage in civil dialogue with the people behind the programs at the Golden Arches.

The site is officially called “McDonald’s Corporate Responsibility Blog”. They discuss topics such as lifestyle, diversity, and the environment. Text is the primary element on the page. Very few graphics and very little white space exist. It appears that McDonald’s is targeting a more mature, relatively well-educated audience interested in the “moral fiber” of McDonald’s.

Their website is a touchy-feely place that attempts to connect with the reader through posts that are longer than a product promotion but not too long to lose a reader’s interest. They seem to top out at nine short paragraphs. They invite comments through a link at the bottom of each post to further engage their reader.

The posts I read did come from a personal perspective as they state in their introduction, always with a draw back to the corporate. Building a sense of community seems to be the motivation. And, if you’re part of the community, it’s hard to criticize the community. Many of the blogs were delicately defending McDonald’s actions or inactions. The attempt appears to be to make McDonald’s look like the “good guy” or, at the very least, “the not-as-bad-as-we’re-made-out-to-be guy”.

PETA
PETA is a little less known. The acronym stands for “People for the Ethical Treatment of Animals”. They are a non-profit corporation which promotes animal rights and, in direct contrast to McDonald’s, a vegan diet.

Their site doesn’t provide a mission statement but, after reading a few posts, it’s clear. They aren’t trying to make the reader feel good. They’re trying to excite the reader to indignation or action.

The site is called “The PETA Files”, a name that brings to mind investigations and criminal activity. The posts address various issues related to animal cruelty, abuse, or exploitation. The site relies on a combination of short articles and brightly colored text scattered throughout with photographs of animals and celebrities. Their audience is generally young and interested in what’s hip and exciting.

The language is direct, at times confrontational or sarcastic. They don’t mince words or shy away from profanity. The posts are short with few exceeding four short paragraphs. As on the McDonald’s site, readers are invited to comment using a link.

The posts are issue focused; there are no personal stories. Many of the posts are a combination of reporting and commentary. The focus on celebrities, the long list of “friends”, and the invitations to post on personal networking sites like Facebook appeal to their audience’s desire to be part of the in-crowd. PETA’s blog is an in-your-face account of their accomplishments and the wrongdoing of others.

The Bottom Line

McDonald’s and PETA are using their blogs for very different purposes in support of their own causes. McDonald’s wants to make you feel good about their organization so you’ll want to do business with them. PETA wants to make you feel bad about those they feel are guilty of animal abuse so you will join them and take action. McDonald’s might delicately tell you that PETA’s vehemence is misplaced and point to any steps where McDonald's has contributed to animal welfare. PETA’s blog will tell you in no uncertain terms to let McDonald’s know exactly what they can do with their “Golden Arches”.