You are currently browsing the tag archive for the ‘graphic design’ tag.

Thank you cards painted by Dalewood Middle School students

Thank you cards painted by Dalewood Middle School students

[Note: Co-posted on createathonchatt.wordpress.com.]

Last weekend I worked alongside thirty-seven fellow students and over forty professionals staying up around the clock doing good for Dalewood Middle School. The experience was nothing less than thoroughly satisfying and overwhelming.

CreateAthon onCampus enables design students to work side-by-side with professionals– designers, developers, writers, architects, interior designers (you get the idea)– and produce creative proposals for non-profit organizations. This year marked the first of many future collaborations between UTC design students, community organizations, and professionals for the benefit of Chattanooga schools.

The thought of working for twenty-four hours straight filled some of us with a bit of trepidation, I’m sure, not to mention the prospect of working side-by-side with professionals. The results far exceeded the expectations. Knowing we made a difference in the lives of the students feels great, but realizing the creative blitz itself positively influenced each of us who participated is even more remarkable to me.The concentrated energy and constant learning during the event fed each of us and propelled us to the finish, student and mentor alike.

Of course, the finish I just mentioned was the end of the twenty-four hours. For me, and I think for others, as well, I won’t feel we are finished until I get the chance to help implement some of the proposals we made for Dalewood Middle School. The excitement I feel in knowing that the work we did isn’t just pie-in-the-sky what ifs, but actually viable proposals that will start benefiting the school right away fills me with awe and I’ve found I’ve been dreaming about the new gallery and art center space. (More on those in the next post.)

I have heard from mentors and fellow students that they are looking forward to working on CreateAthon onCampus again next year. I know I’m not alone in wanting to continue after I graduate  when participation will no longer be a much anticipated requirement, but an amazing opportunity. In fact, I would equate the CreateAthon onCampus to a weekend crash course in teamwork, project management, application training, writing, people skills, and time management–all at the same time–with the whole being greater than the sum of it’s parts because of the collaborative energy expended to benefit a worthy cause. And, that is good for the soul.

As promised, I’ve got 6 web sites today looking at good design and bad design. Of course, it’s all relative. I had a hell of a time getting these pictures to look just OK in the previous post and I imagine this one won’t be any easier. That’s the downside of working with a template – it’s not always the right fit. So while this could be construed as the pot calling the kettle black, I do realize my layout leaves a lot to be desired. I’m just not letting that get in the way of getting the post out the door. (I’ve promised myself that any post started *will* get posted.) On to the comparisons, and keep in mind these aren’t the worst or best I’ve ever seen – just the ones I’ve seen today:

Web Sites with Poor Design

  1. Poor Design - online print site Ex 1

    Poor Design - online print site Ex 1

    Online Printing site: At first glance this is not bad. There’s a nice order to the informational images near the top. However, the block of text below those is too dense. The line length is too long to comfortably read, the line height is too close, and the font size is too small. Also, the left column of navigation buttons is almost overwhelming.

  2. Poor Design - online print site Ex 2

    Poor Design - online print site Ex 2

    Another Online Printing site: Obviously, this page isn’t plagued with densely packed text, however the pricing table is almost impossible to read without holding a piece of paper up the screen so your eye can follow the line to a particular data point. Not to mention, the font size will make your eyes cross trying to discern that much information.

  3. Poor Design - online print site Ex 3

    Poor Design - online print site Ex 3

    One more Online Printing site: I’m not saying online printing sites are notorious for poor design, I’m just showing what I’ve found. This is the home page, scrolled down the page just a bit to show the absolutely dense section of text that *no one* will actually read. Add to that the plethora of little boxes all around and I’m not sure where to look first.

Web Sites with Good Design

  1. Good Design - Ex 1 web design site

    Good Design - Ex 1 web design site

    Web Site about web design: This is one of the definitive sites for reading about good web site design, so, as expected, it has a nice layout. There’s plenty of white space for the eye to rest and the layout is reminiscent of an upscale magazine. (Actually, for good layout, this site is in my top ten favorites.)

  2. Good Design - Ex 2 movie rental site

    Good Design - Ex 2 movie rental site

    Online Movie Rental site: For ease of use, this site is tops. That ease of use springs directly from the layout. If the layout is so dense that it’s hard to find what you’re looking for, then the layout is a FAIL. There’s an immense amount of information on this page, but the layout ensures it’s not overwhelming.

  3. Good Design - Ex 3 blogging site

    Good Design - Ex 3 blogging site

    A Popular Blogging site: Again, lot’s of choices on this page, but they are not so densely packed as to be a turn off. The information is accessible and nicely ordered with enough white space for each element to be independent, yet part of the overall layout.

Well, that’s all I’ve got. Do you agree or disagree with the reasoning behind my choices? What are some sites that stand out for you as particularly good or bad? Let me know in the comments.

Since I began studying design in earnest a year and a half ago, I’ve gotten in the habit of noticing lay-outs of printed matter and comparing that to websites I visit. I’ve looked at website design with a shrewd eye for years, but it’s only recently that I’ve been making the comparisons with print.

Print Matter

Here’s six pictures of different layouts, from magazines to newspapers to ads, showing both good and bad layout. As I said when I was 5 and forced to eat everything on my plate, “Worst for first.” We’ll start by looking at what I consider sub-par design. These are by no means the worst examples of design I’ve seen, just what I came across today.

  1. Example of bad layout design - mailbox flyer for rental store

    Example of bad layout design - mailbox flyer for rental store

    Mailbox flyer for rental store: This piece has way too much going on, there’s not much white space in which to rest your eyes, and it’s difficult to tell what the main focus is. Yes, it’s advertising all the amazing things you can get, but the text is small and I spent all of 5 seconds looking at it before tossing it aside because it required too much energy.

  2. Example of bad layout design - mailbox flyer satellite TV

    Example of bad layout design - mailbox flyer satellite TV

    Mailbox flyer for satellite TV: This isn’t all bad, the main parts of the offer have sufficient padding around them. My big objections are the top where it looks like a salesperson ingested too much company propaganda, got too excited about more than 150 channels, and threw-up up on the page, much to his boss’ dismay. Then there’s the fine print. I always object to fine print because it’s impossible to read, but at least it’s usually at the bottom of the page. This ad includes fine print in the boxes of the main offers. Ugh!

  3. Example of bad layout design - ad page weekly alternative paper

    Example of bad layout design - ad page weekly alternative paper

    Ad page on back of weekly alternative newspaper: This is also not horrible, especially considering the source. I include it here because it’s just not good. There’s too many colors and typefaces, not enough white space. Yes, the ads are competing for attention, but they end up all loosing the fight because it’s too much trouble to look at this page and glean anything from it.

Now on to the good design. Again, these aren’t the best layouts I’ve ever seen, just what I found today.

  1. Good example of design layout - weekly alternative paper

    Good example of design layout - weekly alternative paper

    Weekly alternative newspaper: Considering the type of publication, this is a decent layout. It has a comfortable line-length so reading isn’t too arduous. There’s a nice pull-quote to draw the reader’s attention and there’s enough white space to give some breathing room while not too much to drive up the costs of a small paper. It’s a good compromise.

  2. Example of good layout design - designers magazine

    Example of good layout design - designers magazine

    Magazine for design professionals: This is a magazine I’ve gotten for years and have always enjoyed reading. The layout affords breathing room and the artwork is not crowded. There’s quite a bit of white space on the page, giving the feel of a higher end publication.

  3. Example of good layout design -tutorial magazine

    Example of good layout design -tutorial magazine

    Magazine for digital manipulation of photographs: This magazine caters to artists and designers who want to learn more about the programs they’re using. The layout of the tutorials is clean and organized. It’s easy to follow the steps and see the process from beginning to end.

So, there’s 6 examples of printed matter looking at layouts and paying particular attention to white space – the empty space on the page. Without it information gets lost and reading is too hard.

The next post will look at six examples of web sites and compare the layouts, and the use of white space, to the printed examples.

Neenah Paper Sample Book

Page from a Neenah sample book

Recently, I had the opportunity to attend a Neenah Paper seminar hosted by Blair Digital and Xpedx at green|spaces, and as an added bonus, got to hear more from the rep when he visited one of my design classes. As I stated previously, I love paper. Hearing Barry Clough, from Neenah Paper, gave me the opportunity to learn even more about how it’s made, this time from a mill’s perspective.

Neenah Paper is located in Wisconsin and was started in the 1870’s. Neenah began out as a small mill, but over the years has purchased other paper mills and now commands a large percentage of the market share for printing paper. As technology has changed, the company has introduced many new products to meet the evolving needs of designers and printers.

Acquiring paper samples always brings joy and I now have a growing collection of swatch books to look through for inspiration. As for their usefulness, I never thought about that beyond inspiration and picking the best paper for the project at hand. However, Barry showed us in class how to use them to determine the quality of the paper. He held a piece of copier paper and a page from one of the Neenah swatch books up to a window to compare the formation of the two papers. Formation refers to how evenly distributed the fibers are in the paper. Comparing the copier paper to the Neenah paper showed an even, regular distribution of fibers in the Neenah paper and an uneven, splotchy looking distribution in the copier paper. An even distribution of fibers ensures an even coating of ink. If you’re printing a full-bleed page of a solid color, having an even distribution of paper fibers ensures there will be no splotchy areas where ink (or toner if you’re printing digitally) is thinner than others.

Barry’s visit was entertaining and illuminating and I’m looking forward to more paper seminars in the future.

Photo Credit: Willi Heidelbach Attribution 2.5 Generic

I’ve worked off and on in a quasi-graphic design capacity for about 14 years, albeit the bulk of that time with no formal training. I’ve read lots of books and asked lots of questions to get the print jobs (ranging from T-shirts to books) I’ve been in charge of completed and, in the process, learned quite a bit about getting stuff printed. However, most of the print jobs I ushered through were 10+ years ago and, as we all know, nothing stays the same.

I’m now taking a junior level class called Processes and Materials, which I’ve been looking forward to for a while since we’ll be covering every aspect of printing, from design to finished project. I’m glad to know that a lot of the knowledge I’d already acquired is still good—large bound publications are still printed in signatures, printing at an extremely high resolution on an inkjet printer with bond paper will still produce a wet lumpy mess, and developing a working relationship with a quality print shop is still a good idea, just to name a few.

I’m also looking forward to learning what I don’t know, viz., all the aspects of print that get glossed over by a self-taught person. I knew there were a lot of paper choices, and that’s still true today, but I never learned very much about paper aside from the varying weights because I never needed to know. Other qualities of paper I’m now learning about include finish, strength, thickness, brightness, and opacity. Next up on the learning docket? All the different printing processes and their best uses. I can’t wait.

Resource: From Design into Print , Sandee Cohen, Peachpit Press, © 2009

Example Grid (Click for larger view)

Grids have been used for centuries, starting with the hand-drawn monastic manuscripts, as a way of organizing information in a readable and pleasing format. With the advent of movable type, the typographic grid became an inherent part of the printing process.  Following World War II, Josef Müller-Brockmann championed the use of the modern typographic grid. As the printing process has changed from hands-on to digital, grids have evolved to give even greater flexibility to designers.

According to Alan Swann, “a grid is a geometric division of a space into precisely measured columns, spaces, and margins.” Using a grid allows a designer to quickly and easily create a cohesive layout for books, magazines, and websites. The grid also offers a designer a balanced structure on which to hang the design. Rather than confining design, grids allow infinite variety. They offer a tangible rationale for placement of graphical elements, while giving the designer the opportunity to break the grid to add an element of surprise.

Example of grid in use (Click for larger view)

Designers who Modern designers who use grids are in all aspects of the graphic design industry include Khoi Vinh, Mark Boulton, and Tobias Frere-Jones.

Sources:

How to Understand and Use Grids, Alan Swann, pub. 1989
http://en.wikipedia.org/wiki/Grid_(page_layout)



Enter your email address to follow this blog and receive notifications of new posts by email.

Join 8 other followers