Creative Conundrum

Web Design Opportunities

2010-12-09T16:22:00.003-06:00

The semester is almost over and yet again, I have been tasked with looking for web design opportunities in my area. Depending on what the definition of "my area" is, the answer is "more than six months ago." Though there are still few opportunities in Evansville, the openings posted in Indiana as a whole have increased quite a bit. Unfortunately, most of them are located near Indianapolis or in northern Indiana.

The Advertising Federation of Louisville has some postings in Kentucky that might interest Web Designers in this area. More and more postings also seem to be for "team members" instead of a single designer in charge of everything involving the web. This is encouraging because it shows that many more businesses are beginning to understand the value of web design in their business. Some of the jobs did interest me, in that they involve both design and implementation in the job descriptions. Being in charge of the look of the site as well as the design of it makes the job prospects seem much more interesting to me.

If one wants to do much in the design arena, it still seems as if they will be forced to move at least an hour away from Evansville. More and more lately, especially after the closing of Whirlpool, leaders in this area have been struggling against brain drain. The recent "I am Evansville" campaign is proof enough of that. I think that if we could shift our focus away from manufacturing and more toward a service economy, design opportunities will increase a great deal.

A Survey of Current Browsers

2010-12-07T14:23:00.002-06:00

After many years of being on top, Internet Explorer has finally lost the browser race to Firefox. Due to how difficult it is to design/code for, as well as security issues, IE has never been very well-liked among the design community. However, most laypeople with computers in the US today have PCs, which come pre-installed with IE. Due to the availability of IE, it remains an important browser to consider for those that want to reach a wider audience. The good news is that version 8 of IE has become the most popular version, which doesn't have nearly as many problems as 6.

Firefox is the most used browser among those with at least a bit of Internet savvy, however. It's free, has solid code and is customizable with a number of plug-ins and skins. Most websites design for and around Firefox. If you have Firefox, you should have no problem viewing a well-designed site. Unfortunately, in some cases a user can have their Firefox program laden with too many plug-ins and unnecessary toolbars that can threaten the user experience and break even the best layouts.

Google's Chrome browser still only has a small chunk of the total share, but it has been steadily gaining momentum since its release in 2008. It's a very user-friendly and simplistic browser, without a lot of extra bells and whistles that can interfere with the user experience. It is as solid, if not more solid, than Firefox when it comes to defense against viruses and other issues. I expect to see more and more adoption of Chrome in the future, helping to eliminate IE and threaten Firefox's share.

Safari, the standard browser available for Mac, is also a very solid and user-friendly browser (just as Macs tend to be). However, it is very weak defensively and surprisingly easy to hack, despite the reputation of Macs themselves. Since most Mac users tend to be computer-savvy professionals, I believe they end up downloading Firefox immediately upon acquiring their new computers. For this reason, I believe, Safari continues to hold a very small share.

Overall, I feel Firefox continues to be the best browser for its availability, widespread support and solid history. In the future, Chrome might give Firefox a run for it's money, however!

Web Typography

2010-11-04T14:54:00.003-05:00

In twenty years, web design has come a long way. First we were given images to work with, and then more color choices, and then more font choices... But not many. The problem with using typography in a web page design is that the viewer has to have the font on his or her machine. Your average user doesn't have fancy fonts beside the system fonts their computer came with.

To solve this dilemma, a lot of designers began placing the fonts they wanted to show in images and embedding them into their page layouts. While this approach worked from a visual standpoint, it caused a number of accessibility and SEO issues. Not to mention that if one wanted to copy and paste the information, he or she could not.

So, why not provide the end user with the font so that they could view your design as intended... as it shows on your machine? The easiest and most acceptable option is the "@font-face" command, which allows the CSS to fetch a needed font from somewhere on the server. The problem with this method is that anyone with the knowledge could dig into the server and download the font for himself. In the case of fonts with limited use licenses, this is comparable to theft. There are some font foundries that allow their fonts to be used for free in your designs, but you're still limited in your choices. Also, IE doesn't support the "@font-face" command.

Speaking of Microsoft, they came up with their own solution to the licensing problem by providing some fonts in the "Embedded Open Type (.EOT)" format, which temporarily downloads a font for view on a specified site per machine. Unfortunately, IE is the only browser that supports this method, and many are critical of the restrictive nature of the font usage.

The most widely-accepted method at the moment is to subscribe to font services like Typekit, which allow you use of their font libraries or the option of uploading your own fonts for a monthly fee. This method is the least exploitative of creators of fonts, but the most painful for users of fonts, especially those that can't afford the fees involved.

The future of Web Typography seems to be pretty uncertain. Nobody can come to an agreement on what method is best, and a consensus has to occur before the W3C will endorse that method. I personally feel that if you want to utilize the best fonts, you're going to have to pay in some form or another. A means of uploading and sharing the fonts you've paid to license will probably be the best method that makes everyone happy.

This blog entry is really informative and lists a good batch of links that can help designers explore their options.

Designing with Color

2010-09-16T15:32:00.002-05:00

Color is a terribly important thing for a graphic designer to consider. The same is true for a web designer. Certain colors evoke emotions in their viewers, and when one is designing a site, he must consider how he wants the viewer to feel about the product he is presenting. Do you want your viewer to be excited? Do you want your client to be viewed as trendy and young or more mature and responsible?

The Psychology of Color does a great job of explaining the emotions that certain colors are meant to evoke in viewers, and how members of different cultures can view colors differently. Designing for Americans is different from designing for the Chinese, for example. While white evokes purity and cleanness for us, it is also the color of mourning in some countries.

Once you've decided what your primary color is going to be, you need to select other colors to use along with it... Your text, accents and imagery all need to "get along" with your primary color. Colorblender.com has a wonderfully simple tool to help you accomplish this task. By selecting any color on the RGB scale you will be presented with a color blend that you can use to design your site around, complete with Hex Codes.

However, if you don't really understand what the heck a blend is (I had to Google it myself) you can go a more direct route. Color Scheme Designer allows you to take a more proactive approach to your color design by selecting a primary color and finding the accent colors by using the classic rules of complimentary color. You can also see how the colors might come together in a site with just the click of a button. This also provides Hex Codes to help you on your way.

Art Direction on the Web

2010-08-31T16:33:00.002-05:00

The newest trend in the graphic design world is "Art Direction" on blog entries/web sites. Unlike, say, this blog, where the entire blog is cohesively designed and every entry follows suit... Each entry gets a unique design that corresponds to the content, like a magazine article would.

This can be observed on Jason Santa Maria's site where each article often receives a completely different color, font and graphic treatment. He brings up good points about how sites can easily mimic print design to add visual interest. Personally, I wondered why it took web designers so long to reach this point. I think that, for a long time, web designers and graphic designers were different creatures. Finally, you are starting to see more people wearing both hats.

My first thought is that, perhaps, web surfers are more fickle and have shorter attention spans. Instead of pretty graphics they want straight information, easily laid out with links clearly visible. However, I then realized that attractive design could easily draw in a reader and keep him there. Unfortunately, from what I've witnessed so far, I think that "Art Directors" are often more concerned with the design aspect of each entry and less about delivery of information. I see big and bold and to the point, but I have yet to really linger on what the text is actually trying to convey. "Okay, this entry's about pencils aaand what is it trying to tell me about pencils? Okay just one paragraph." Why spend all that time designing a page around such a minimal amount of information? I think that design and information need to be married more closely.

I also have a problem with the lack of cohesiveness. With every page being different, there is often little to link a person back to the originating page. I feel that there has to be at least a certain amount of similar elements to keep the entire site and the designer's vision in one place. In most magazines you will often see radical headlines and graphics, but the body text, treatment of columns, etc. still remains the same. You can open a copy of Wired to any page and know that you are reading Wired. With some of these blogs, each page is radically different and the only thing tying you back to the designer is his logo, tucked away in a corner somewhere.

In other words, I feel that this is a promising new direction that needs to be further refined until it becomes as efficient as what we were doing before.

My Goals for This Class

2010-08-25T12:11:00.002-05:00

Here I am again writing about my goals for the upcoming semester. Looking back at the blog I wrote for last semester, I feel that I definitely accomplished the goals I set forth. I now have a simple yet attractive website, though the coding needs improvement. As I said before, it seems that any Designer worth his paycheck these days has knowledge in Web Design, and I don't want to be left out in the cold. As well, I like being able to represent myself in a professional manner on the Internet.

I would like to tighten up my now pre-existing knowledge of html and CSS, and possibly learn more advanced techniques like Javascript so that I can make my pages more functional on their own without relying on outside scripts. As far as the basic coding goes, I still have a great deal that I need to learn. I managed to float by with a few basic commands and even those only worked for me after lots of sweat and tears! Even then, there are some issues with viewing my website in browsers other than Firefox. Woe!

Though I am seeking a degree in Graphic Design, my true passion is for illustration, and more and more often nowadays you hear about Illustrators being discovered solely on the strength of their online portfolios. I feel if I could have a strong Internet presence, it would do a great deal to advance my career in the right direction.

Mowey and Dibby

2010-07-19T16:02:00.002-05:00

So a good friend recently commissioned me to design the mascot for her boyfriend's burgeoning lawncare business. He wanted something simple but eyecatching to put on his flyers. She sent some clip-art of a lawnmower with very specific instructions regarding how to design the character's face.

The liked the first one and suggested only minor changes; erasing one of the more technical pieces of the mower, filling in the wheels and raising the bar a bit.

Easy peasy, and so now I present MOWEY in all his finalized glory!

I finished an illustration for myself yesterday of my own interpretation of Dib from Invader Zim. My friend sent me the song "Master of the Universe" by the Sick Puppies, saying that it was suited for him! I agree, and that inspired this drawing.

I cleaned up the sketch and decided to color it without even bothering to ink. I like the effect, I think it makes it look a bit more grungy.

I put some choice lyrics on the image, and that was originally my plan; but once I got them in place I wasn't too wild about how it looked. I love playing with type but I guess it doesn't do as well with my illustrations. My hubby and I agreed that it would probably be best to remove the type and crop the image.

Ta-daaa!

DaMenSion and Batman

2010-06-20T22:02:00.003-05:00

Man, it's been a month since I updated! Sorry (as if anyone reads this lol!)! Real life grabbed me by the lapels and wouldn't let go.

I have one more assignment to share before I'm done with this semester. Dave wanted us to see what we could do to improve the reputation of DaFont. For those that don't know, it's a site where one can download free fonts for just about any use, submitted by various creators. It doesn't seem that there is much quality control there, and it has a bad reputation among graphic designers.

He showed us some booklets from sites like Veer, that offer resources from fonts to stock illustrations. I felt that DaFont could easily steer in that direction, but keep the industriousness and community vibe that it already possesses. I thought it would be a neat idea for each creator to be able to have their own sort of "storefront" on the site to attract people toward their work... And also include more of a "networking" aspect that having a larger variety of work would provide.

So I decided the best way to showcase that would be to have a "theme" for every page, alternating between stock photos and illustration. We'd also need a new name to communicate how EDGY AND DYNAMIC the site is now. So I came up with "DaMenSion" because, you know, 3rd dimension and all.

A lot of us went along with that basic idea. It probably wasn't the most innovative thing I could've come up with, but I was more concerned with finishing an 8 page booklet in a timely manner. (It actually wasn't as difficult to accomplish as I thought it would be!)

All of the fonts are taken from DaFont. I must say that only one of the fonts was, in my opinion, badly constructed. I won't tell you which one, however! Hopefully you won't be able to tell. I played around with all of them to get them to my liking.

The illustrations are all taken from Veer... And I believe the photos are mostly from the Stock Exchange. Seeing as how this is effectively just a mock-up, I hope that nobody is offended that I used their work. I took care to ensure that most everything was royalty-free, save for the illos. I used the lower-quality versions that Veer provides for my project.

I love the front cover the most, because this is the most experimentation I've done with type so far.

I had to put some thought into how the pages would be arranged so they would print out correctly. I put pages 2 and 6 together originally, and my mind didn't even linger on the fact that two even-numbered pages would NOT face eachother.

The superhero drawing is mine! DMS man! I originally had the text laid out differently to compliment each image, but Dave and the class thought I should have more consistency between each page. So now the cute girl's eyes are covered. She is anonymous!

And the photo of the final booklet! (Taken with my phone tee hee)

Also: A fun little birthday gift I made for my friend! She loves Batman and is into silly things like me XD So I came up with this idea.

(Wait for it... it's animated!)

Evansville Museum Ad Campaign

2010-05-15T13:39:00.003-05:00

This assignment involved picking a local business from a list and coming up with a nice ad campaign for it. Surprisingly, most of the class picked the Evansville Museum along with me. They're a privately run museum that's currently trying to raise the money needed for an expansion. They have a lot of neat exhibits but not a lot to capture the public interest. Therefore, I first sat down and considered what the museum already HAD that could bring in the public.

My favorite part of the museum in my youth was the replicas of Lincoln's home and other period shops and homes, so I focused a lot on Lincoln and log cabins in my initial sketches. They also have the EMTRAC museum that has an actual train you can check out, and a planetarium. I also tried to think of more cost-effective means of advertising, because they obviously don't have a huge ad budget.

I really liked my idea to create postcards that could be folded into interesting things. I had a log cabin, a "planetarium" that you could pop on top of a flashlight, a train, and other silly things.

When Dave looked at my sketches he wondered what my obsession with Lincoln was and when I replied that I was trying to focus on the stuff that they had to attract customers, he encouraged me to perhaps think of some stuff that the museum NEEDED that could also attract guests.

Upon researching other museums, I decided that our museum needed DINOSAURS and a cafe. They're located right on the river, providing what would be a really nice view for visitors that would like to drink some coffee and sit a spell.

My ideas were distilled down to some final concepts.

First, I created my billboard. It would set the standard for everything afterward. The image is from the Stock Exchange as so many of my images are! The font used for "celestial" is from Blambot, I think, as so many of my fonts are.

Some of my classmates weren't wild about the font, so I changed it out for my final draft. Font from Blambot yet again, I believe!

Next, I created the buswrap. It is difficult to find a usable dinosaur skeleton just lying around, you know? I eventually settled on this one, just for the purposes of the assignment. The bus is from the Stock Exchange, yet again~ I really wanted to find a usable image of the buses our own METS uses but could not. I took photos of our buses but they didn't work well once I plopped them in Photoshop. The billboard and building itself were my only usable photos, actually.

Third is the magazine ad! This is my favorite one. Why do I have such love for a dying medium?? The picture of the river is by myself, and the coffee is from the Stock Exchange. When it was all said and done, someone remarked that it reminded them of another ad campaign from someplace... Like Jimmy John's or something? I guess by the way the words are stacked. But... I LIKE stacking words... ;)

Lastly is my "installation." The EMTRAC was NEVER open when I had a chance to come down and take photos, and as I said, most of what I took didn't work well anyway. I had the idea to make a sort of installation along the building using train tracks and a replica train, but that just didn't pan out. Instead I created a huge banner! With a train I took from the Stock Exchange. It really wasn't detailed enough to make a good banner image, though. Curse you, trains!

MSI Site Design and STFU Tak Illustration

2010-05-10T15:59:00.002-05:00

Today I have a Web Design project for you and a new illustration!

This project involved choosing a band with at least four releases and redesigning their logo, then creating a discography and merchandise page for them. I chose Mindless Self Indulgence because they are my favorite band and their site is okay but rather disjointed design-wise.

MSI uses a lot of Nintendo chipset music in their work, as well as having lots of bright, neon techno elements in their design aesthetic. I wanted to stick to that, while making it a little more slick since they've been sort of entering mainstream music.

I tried playing with Impact and layering colors to see how they'd interact. (The "MSI" logo is intentionally vulgar, haha! MSI is a bit of a vulgar band. Don't hate!) I also had my prerequisite hand-drawn font. I downloaded a nice font from Blambot and played a lot with its serifs. We all ended up liking that logo the best.

Once the logo was straightened out, I went about designing the pages. I stuck with my techno vibe in my sketches.

I really liked the circuit board and microchip ideas I'd come up with, but trying to integrate them practically didn't really work. I did end up using the sort of "electrical current" vibe in my final design, though.

For my first draft, Dave didn't quite dig the way I had laid out my navigation links. My classmates also pointed out that the gradient was a little ugly looking. It's supposed to fade from green to pink, but I intended for the page to extend beyond this "preview" window, so I didn't adjust the length of the gradient.

So I fixed those things! Made the nav links smaller and separated them with the fonts neato "asterisk." The way the page is supposed to work is that when you scroll over each thumbnail, it increases in size. If you click on it, additional info and order links will appear. MSI doesn't quite have their own storefront for a lot of their music; you are taken to other sites to order.

Then came the merchandise page! This one operated on the same basic premise, except I also added a shopping cart and size menus and the like.

I'm pretty pleased with this but I ended up getting a "B." Horrors! Dave said that the lack of a grid might be confusing... Which confused me, because I am sort of operating on a grid. *sobs!*

Next is an illustration I did for a good friend of mine. She gave me a hand with something when I was in a bind! This features her character Bianca and my versions of two characters from the old TV show Invader Zim. Bianca and the alien don't get along very well, and the poor hairy guy is caught in the middle. Love triangle!

By clicking on the thumb you can see my pencils, inks and the final version. :)

Conbook

2010-05-06T20:02:00.002-05:00

Of the projects I did this semester, this one is probably my favorite. It combines two of my most favoritest things: Illustration and Magazine layout. (Both things that are going out of vogue in today's high-tech times, eh? I've always been on the cutting edge of trends that way)

So anyway, we were tasked with creating a four-page magazine layout focusing on a subject from a list we were given. One of the subjects was "Social Networking and Privacy," with a link to this news article. I took the assignment pretty literally and assumed we were supposed to actually sort of lay out the ARTICLE.

First, of course, were sketches.

My first idea was for a sad man to be tethered by the neck to a computer monitor. Then I thought about having a pair of hands coming from behind bars, typing on a keyboard... Next I thought of going for a more "Facebook-esque" layout... And then came the "mouse turning to handcuffs" idea. Everyone seemed to like the mousecuffs, so I went ahead with that one.

Funny (or perhaps sad) story: I actually went and looked at photos of mice on Google when I drew the mouse. And yet I still managed to draw it monumentally WRONG. The buttons were on the bottom with the scroll wheel floating somewhere up in space.

The drawings I did made it through, like, two critiques and several instances of my instructor looking at the image while giving me feedback... As well as, of course, my own eyes staring at the thing... And nobody noticed my mistake until the final critique. And I'll probably never live it down, either!

But that's ok, I fixed it.

I think everything turned out pretty nicely. I wonder if I should have justified the text, though. Yet again I misunderstood some conversation about the whole thing and thought it should all be left-aligned.

Now this is mounted and hanging up in the Visual Communications hallway. Hooray!

Dash Dash Dash...

2010-05-05T23:13:00.002-05:00

Dot Dot Dot Dot Dash Dash Dash. Or is it the other way around? I don't know morse code.

So anyway! Gonna get caught up on my projects, here! This is the first site design Dave had us do for Web Design I. The project entailed taking a box from home and turning every side of it into a site! A much taller order than I suspected it would be, probably because I picked a box with a lot of redundant information on it.

But I picked the box I did because it had cute graphics on it.

(S.O.S is a marvelous product, by the way. I just recently started living by myself and cooking, and this makes cleaning up so crazy easy...)

Of course, the first thing we had to do was sketch out our plans...

I pretty much knew what I wanted as far as layout goes. I thought it would be neat to use the tab as a navigation button of sorts. I pretty much knew what graphics I wanted for the main page as well. I think perhaps Dave suggested some lavender in the background to make it more interesting.

Originally I tried a photo of some lavender fields, vector traced to better match the illustrations. Nobody really liked it, and looking at it myself I thought it kinda looked like somebody's head... Braided into purple corn rows. SO instead I headed on over to the Old Stock Exchange and found me a nice photograph of some lavender flowers. Everything started to come together after that!

I redid the logo and left out the bevels and the lens flare. I think most people would agree it's an improvement... And then I redrew the lavender in Illustrator, which was fun.

Next was the "Uses" page, which took up the back of the box. That had the neato graphics that I liked so much. I tried reproducing them in Illustrator but they just didn't look right... Instead I cleaned up the box scans I did in Photoshop and just plopped them in. The effect I wanted on the page was for the user to be able to scroll over an image and cause it to roll to the side, revealing the uses for that area.

Last came the "Green" page... The only other page I could really glean out of the content on the box. It's a pretty minimalistic design, haha! Nothing much to say about this one.

And there you have it! My first website design (for a grade)!

Survey of Web Design Employment Opportunities in my Area

2010-05-04T13:44:00.002-05:00

I searched Indeed, Courier and Press, Monster, Authenticjobs and Ivy Tech's own Jobzone... And the answer is "not much is available in my area." Even freelance opportunities in other areas seemed to be scarce. That doesn't surprise me considering the fact that our economy is probably doing better than in many other states. The only job that would even remotely interest me is for a Web Content Specialist position at Courier and Press itself. Everything else was the typical "WORK FROM HOME AND MAKE $$$" listings you tend to find in every classified section.

From Graphic Design job listings I've seen in the past, I know that pretty much any creative job these days requires you to have some web design experience... Which is why I enrolled in this class. I can't help but wonder about the general conditions around this phenomenon, however. How many companies have completely dedicated web design professionals? I imagine many of them either contract out that kind of work or make some poor sap with another job description attend to it. With the Internet environment as it is today, so many companies still seem to put their sites in the hands of third parties or nonprofessionals.

What is SEO?

2010-03-30T16:25:00.003-05:00

SEO is short for "Search Engine Optimization." At the very root, it would appear to be something invaluable to a business. Using SEO a website, theoretically, can manipulate its place in search engine rankings. Unfortunately, abuse of SEO by unscrupulous businesses over the years has caused it to go out of vogue.

In the past, a web designer could use meta tags in his code to show search bots exactly what his web site deals with. Abuse of these tags by inserting popular search terms (like "sex") to boost search engine ranking has led most search engines to ignore meta tagging. Instead, A List Apart suggests coming up with the keywords most relevant to your audience and being sure to insert them into your body copy. Insuring that your site usage and search results come organically is the best way to secure your space on search pages. Be subtle! If you're too aggressive, search engines will consider you a threat and bump you from their results pages.

These days, the most popular search engines, such as Yahoo! and Google, don't shed much light on their search algorithms to ensure that there is no abuse. Google itself makes it quite clear that there is no magic way to make your site appear as the number one search result. Overall, SEO is tied into accessibility. If you ensure that your website is clear, concise, and relevant, your users will both thank you and be able to find you easily. Their traffic will be what ensures your search engine standing.

Evansville Bowl for the Cure 2010

2010-03-23T00:34:00.004-05:00

Two posts in one day, I know! But this one is shorter, ok?

One of the coordinators for Evansville's "Susan G. Komen - Bowl for the Cure" works in our school's fitness center. They're trying to get more college students to participate, I guess... So they're looking to have some colleges students design their new logo. Because she works at our school she allowed us to have a crack before any other area colleges :) I think, currently, our class's logos are being looked over by the folks down in Dallas. Maybe one of us will get picked, eh?

This one needed a quicker turnaround than any other project we've done so far, so I didn't go for any sort of amazing innovation. Our client mentioned that this was their 11th year for this event they possibly wanted to play off of that. Other than that we had free reign.

I just stuck with my typical hand-wrought style when it came to my final designs. (Yes, the font is made by moi) I figured that if they were aiming for a younger audience, it might work. Right?

I think I finished this assignment with maybe 15 minutes to spare. Whew!

The Ageless Aesthetic Institute

2010-03-22T10:48:00.003-05:00

For this assignment we had to redesign the logo of an existing company, and then create a stationery package for it. I knew I wanted to do The Ageless Aesthetic Institute because it was girly and I can do girly, lol.

First, I did about a million sketches. I really had no idea what sort of logo I wanted to go for. Just a simple mark would've been best since I wanted to communicate a dignified and clean aesthetic... But what about a neat logomark?

Click to visit the sketch page

Eventually I settled on five logos that I felt somewhat successfully communicated what I wanted:

I was hung up on using these geometric shapes to represent the first letter of each word, and trying to organize them in an interesting way.

I really liked the little sundial logomark I came up with, so I introduced that. It's the only hand-drawn logo out of my solutions.

I really liked this little "hourglass" too. Another play on the "Ageless" thing. But one of my classmates thought the top of the glass looked like an asscrack. Or perhaps the crack in front XD So I definitely didn't feel like pursuing that one.

The "eyelash" mark was simple but effective, I thought. Here I present it with a more dignified font.

I ended up settling on this one, which has a bit more "modern" font. I used a system font and just made it super-thin by messing around with the strokes.

Now that I had my logo, it was time to design the stationery. I wanted to keep the teal and brown theme they had going on their site, I thought it was effective. I tried to go simpler than I tend to do on these things, so I basically just used the "eyelash" in different permutations. I liked the idea of making it sort of "go off" the paper and come back into it.

In the case of the envelope, you can see where my line of thinking was going. This template is off of Designer's Toolbox. A really neat site that a classmate pointed out to us. It looks super neat when it's printed out and nicely folded.

On the back of the business card, you can see the connection between the two "lashes," which I carried over into the brown blocks of color on the thank you cards. The dotted lines around the corners of the business card indicate that I wanted it to be a round die-cut. There is a design on the back of the letterhead, too.

Here's a photo of the real deal!

Web Design Tutorial Critiques

2010-02-09T13:50:00.002-06:00

Today we were tasked with critiquing a few of the 27 Best Web Design Tutorials. I scrolled through and picked the sites that appealed the most to be aesthetically.

First on the list is the Funky Web Design Layout. Butterflies! This is a very easy to follow tutorial that provides screencaptures of each step. Being a visual learner, I appreciate this a great deal. There are some neat little tricks in here, like warping the dashes to create dividers, that I never thought of. There is also a downloadable PSD file to go along with it that includes some of the brushes used. ...if you're willing to shell out for it! It doesn't explain how to install the brushes so if you're not familiar, you'll have to find another tutorial for that!

Next I decided to learn How to create a Dark Themed Web Design from Scratch. This one has a higher text to photo ratio and my eyes started glazing over a bit as I went through. That being said, it explains some useful things the last tutorial didn't, such as where your viewer's eyes will go the moment they hit your page, and the prudence of grouping similar elements in Photoshop. In the end I'm not too sure about all those gradienty boxy things, I think they just clutter up the layout, the way they were used. This is another tutorial that provides a download if you're willing to register with them.

Last was an Urban Layout Perfect for a Web Design Company (though one thinks they might be in the wrong business if they need a tutorial to create their site...). As complicated as the design looks at first glance, you find that it is actually very simple and created with only a handfull of brushes. The screencaps do much of the talking in this one, as I don't think the writer's first language is English. That's just fine with me! I feel I could easily recreate this design just by glancing through. The download available with this one was free, with lots of links to free brushes.

Paul Rand

2010-02-04T14:26:00.003-06:00

I admit that I am a little ashamed of myself for not knowing about Paul Rand until last year. He is an incredibly influential designer who remained relevant and productive from the beginning of his career. In the 60s he created some of the world's most recognizable logos, many of which are still in use today... If not in their original form, then in some variant of it. His design philosophy was one of elegant simplicity and bold color. His many treatises about design seem to have earned him a reputation as a grumpy old man who didn't like change... but I don't necessarily fault him for that. The staying power of his work is a testament to the effectiveness of his philosophies. His work is incredibly important to the profession of graphic design, especially in modern times when computers and fancy filters have taken over a lot of the common designer's sensibilities. He drives the point home that complicating your designs too much will ensure that the public forgets about them very quickly.

My favorite works of his are, of course, his children's book illustrations. He developed a simplistic style using paper cut-outs: bold blocks of color paired with loose but expressive lineart. In a way the illustrations show their age, due to the amount of similar work that can be found from the 50s on to as late as the 80s, but similar illustration methods can be found today.

D, U, and A

2010-02-02T14:25:00.002-06:00

What do those letters stand for? Design, Usability and Accessibility, the three most important words to a web designer. Design is a natural, but some people don't realize how important the other two are when integrated with Design. In this article Emmanuel King Turner makes the case that information architecture works best when integrated naturally with good design. A flashy package must go with an organized presentation in order to be successful.

A good design without Usability is nothing. Something as simple as site navigation affects usability. Derek Powazek argues that at any given time, a user should be able to glance at a page and tell where exactly he is. From there, one should be able to click and navigate easily to where he wants to go and not be, for instance, sent back to the same page he was on.

Accessibility is the most elusive and, I imagine, most neglected part of web design. When creating a page, all smart designers consider the demographic that they will be appealing to, don't they? But they likely consider that demographic to be comprised of computer users without disabilities. Unfortunately, many websites don't take into account that they might have readers who are blind, paralyzed, or suffering from a learning disability such as dyslexia. Those readers have to use secondary programs such as text readers or move their cursors with means other than a mouse. Accessibility issues can also occur for those using alternative browsing methods, such as a cell phone. Making your site accessible to everyone means capturing the almighty dollar that other companies, like Target, will not get to see.

The Web Design Process and My Role

2010-01-26T13:54:00.002-06:00

The construction of any given website has many steps. It starts with conception; either by defining your own goals for the site or by meeting with the client. Once one decides what he wants to represent, there is a great deal of research, just like any graphic design project. Then you create thumbnails and decide upon the information structure. In larger web development firms, a specialist would likely design the intricate pathways required to keep the information flow going in a large site. Finally, the content for the site such as graphics and body copy are created. After the site is put together, it is tested (hopefully rigorously) in various browsers and operating systems to ensure it works well. If so, then it can finally go live! After which time periodic upkeep (testing, redesign, etc.) must occur.

Of course, the most interesting portion of web design to me is the design and content creation. I want to make the site look pretty! I want everything to fit together nicely and have visual flow. To me, if a site looks nice, I might be more tolerant of small usability issues. If a site looks terrible I might not even bother to explore its contents. Of course, I know that programming is the most important part of website creation, without which the pretty pictures would never display correctly.

The Web: A History

2010-01-19T14:29:00.002-06:00

Tim Berners-Lee is credited with the creation of the Internet as we know it. In truth, he created the skeleton that allowed us to insert our own meat. Since 1945, academia has discussed the concept of inserting "links" within informational documents to allow a reader to surf to other information. Others before Tim began to make prototypes for such a program, but it wasn't until 1989 that he finally finished the "WorldWideWeb," which allowed widespread usage of a single, universal programming language. Adoption of this language steadily rose, and soon browsers were created to help make it more palatable. The "Mosaic" browser was the first to display images along with the available text, making web usage more attractive to the layperson.

These steps made the Internet what it is today; a network of user-created content, infinitely linked by other user-created pages in a delicate "web." Without people to communicate with, the web would be empty and have no meaning. Berners-Lee revolutionized the way we communicate not only by creating a universal programming language, but also by pushing everyone he possibly could to adopt and share this language. From the very beginning, the Internet was about communication. File and information sharing through e-mail and then BBS made the Internet more attractive to academia than ever before.

His Shadow is Light

2010-01-13T11:25:00.004-06:00

Dave encouraged me to continue with the blog thing even after Graphic Design was over. I think it's a good idea! So here I am detailing my final project for that class. We were to redesign packaging for an existing product, doing our best to be innovative.

I chose to redesign the packaging for the CD His Shadow is Light by Jay Tholen. He is one of my favorite musicians and I had been listening to tracks 2 through 4 quite a bit at the time!

So first off, I needed to do a ton of sketches. Most of these actually came very easily to me, which is encouraging. Do I have a future designing packages?

The album has a very heavy religious vibe, but there are also creepy undertones. So I went with a lot of imagery involving the cross, along with some "He's watching you" touches here and there.

Click

Click

Click

The one below was inspired by this CD package design that I found on Google. By this point I had met my sketch quota and was just brainstorming with extra time.

Click

Click

After viewing my sketches, we all decided that the "eyeball" sketch would be the best. I then went about creating a mockup at about 1/3rd scale. I didn't think I needed to spend as much time on that and instead concentrated on the package decoration. I regret this now, as my flimsy paper mockup LOOKED just fine... but if I had really spent time examining it I would have found that my measurements were completely off!

But I did not. And so I went ahead with my design. I used lettering I'd created for a typography project on the package. I thought that the whimsical look I was going for was captured well by that text.

Click

After that, it was time to make the actual packaging! Finding the right materials that would work with my printer proved challenging. First, I tried to run card stock through my printer but it refused. A friend gave me some nice glossy paper I tried to use instead, but my inkjet printer hated it. The lettering came out all fuzzy. I ended up having to use plain printer paper and spray tack it onto poster board.

I managed to get through the cutting phase mostly unscathed, but once I began constructing the package I ran into a host of problems. As I said before, my measurements were somehow off. One flap of the front cover was too short, and the other flap was too long by just as much! Eek! So... I doubled up the magnets I had procured on one side so that it would even out. As I folded up the sides and began to glue them, I found that rubber cement, the best thing I had available, just wasn't going to hold it. I guess I should invest in a glue gun. After a great deal of grunting and pinching, I finally got it to stay in place.

Look at my beautiful package! (yeah, I know, not that beautiful)

If I had enough time to refine and redo this thing... Perhaps, an extra week, I am confident that I could have made it fantastic. As it stands, it is just... mediocre. But I learned a great deal!

At least I now have an actual CD case for this lovely CD I downloaded :) (feel free to examine this image and question my tastes in music/games)

My Goals for this Class and Domain Choices

2010-01-12T14:02:00.003-06:00

My goals for Web Design are ultimately pretty simple: I want to be able to design a simple but attractive website. I have had a site of my own for seven years now, but I haven't actively updated it since 2006. That is mostly because Netscape stopped offering its browser package, which included the program I used to design my sites! I know a little HTML but there is no way that I can create a site by hand in notepad like some people do. I also admit to getting easily frustrated. If something doesn't come to me naturally, and I have to expend a lot of trial and error to get it to work, I usually throw up my hands and walk away. For this reason I have not had a lot of luck teaching myself how to do this stuff.

I see a lot of beautiful site designs like Bara-chan's and feel envious. I want to learn how to do mouse-over effects and have my art pop up in a little window or frame instead of making the viewer load a new page as I had to do in the past.

Oh yeah, and there is also the fact that almost all the graphic design jobs I've seen posted in the area also deal with web design. It seems impossible to be successful unless you can accomplish both.

So, as I mentioned, I already had a website. The host that I have used from the very beginning is Dreamhost. They have always had competitive pricing, great support and reliable service. In the 7 years I've had my site, it has only been down perhaps twice, and that was early on. I admit that I did not select the service myself. My ex-boyfriend did. In the beginning we had a joint site, but I took it over rather quickly because he rarely updated his half. At the time, I believe affordability and space were our main concerns.

One thing I did procure recently was a new domain name. My old name was really geeky and I will not tell you what it was! Back when we first created the site, it was meant for all our cartoon art and not meant to be a professional design presence. Now that I am trying to become a professional I decided I needed a new domain. I chose my name because it is a fairly unique one. I actually wanted something even more unique but that domain had a photo of a horse and a youtube video on it. ...and that's all. Can you believe the nerve?? ;)

So that is how jennlantrip.net came about. :)

Also, a note: If anyone reads further back in this journal, you will notice that some links are dead. That is because I used to put the images for my entries on my old domain. I will have to correct this error sometime in the future, haha.

Four Magazine Ads

2009-12-01T21:44:00.004-06:00

This time around we were tasked with creating four print magazine ads: Two for Newsweek, two for Rolling Stone, of the same product. We had to adapt the ads for each market. The first thing I had to come up with was the product. Something I actually knew about that would appeal to both audiences. I ended up selecting "A CAR!" because, well, everyone drives them. And I came up with the tagline "0 to 60 in under $20,000" which I thought was pretty clever (nobody correct me ;P).

In class we looked through the magazines in question, and Newsweek had an ad for the Ford Fusion. I believe Tony suggested I go with that particular car and I ended up doing so, because I don't really know much about cars (okay, in the last paragraph I said "knew about," not "knew about"...). They make a hybrid version of the vehicle which I felt was a nice jumping-off point.

So then, I did sketches! First, I had to make my rad "0 to 60" idea come to life...

The lights on the Ford Fusion have this neat little honeycomb thing going on, so I considered integrating that into the design. (As you can see, I also can't draw cars, which is another reason why I chose this subject: to challenge myself a bit.) So that was my first Rolling Stone ad.

Then, I thought about something else that would appeal to that audience. Customization!

I thought I could cut the car up into pieces and that would be pretty cool.

Next came the Newsweek readers. What would appeal to them? Well, the environmental and socially responsible aspect of the hybrid probably would.

So here I have vines coming out of the gas tank, hilighting some of the more positive aspects of the vehicle and the company that makes it.

Then I thought about the most important things to Newsweek readers: Money and family. So then the (incredibly unoriginal) tagline "Do the Math" came to mind.

As you can probably see, I was taking a bit more of an illustrative, "kiddy" angle in my original sketches.

I don't know what this was going to be. I think I was going for a hippie vibe at some point but I discarded it.

I started on my final images before the next class, because I planned to perhaps make live traces of the cars and slap lineart over them, as I did in another class for another project.

During the critique it was decided that my text for 0 to 60 was just to cute and kiddy for Rolling Stone... and my "Do the Math" concept was just... altogether not working. So I came up with some grittier text and started working on 0 to 60...

In the second critique we decided that the live trace thing wasn't working out in the slightest. Sooo I had to find some good photos of the cars and do lots and lots of pen tool work. Most of the cars I used were from Ford's own promotional/storefront sites. Apologies for lack of credit if I slipped up and didn't include something I should have, though.

I actually attempted some of this one before everyone was all, "Giant adding machine? Jennifer please."

Ah, there we go. I also got rid of the honeycombs because they just weren't necessary at all.

I did not draw the vines by hand because those just would not work for my audience. Instead I made selections in Photoshop and applied gradients. If I had Illustrator at the time I would have probably attempted gradient meshes to make them look a little more 3D...

The parts I used in this were taken from various searches on Google... So I do not have photo credits :( The cars themselves are from Ford, though. It was determined after the fact that this one would've been better suited for Newsweek... I should've made it look edgier, darn it.

DO THE MATH. Nothing I tried to put together for this worked out. I finally copped out and made it look like a chalkboard. Original as hell, I know. but it gets the point across, doesn't it? Yes, it does. It is so bright because it was originally configured for print.

Now leave me alone. It's past my bedtime. Three minutes past, to be exact.

Brochure Design Process

2009-11-23T23:13:00.002-06:00

The first time that I was tasked with designing a brochure, I admit to being intimidated. By this point, I feel that I am much more able to make my ideas come together in a cohesive fashion. From the list of clients we were given, I automatically gravitated toward the option of designing for myself. For me, being able to promote myself and focus on my strengths is a challenge. I also felt that I needed something that I could hand out to potential clients, something a little beefier than a business card.

The option to give the brochure a die-cut was attractive to me, and I got the idea to make a cartoony version of myself, with my eyes peeking over the front of the brochure.

(click for image)

(click for image)

As I worked on the brochure itself, Joe suggested that I do a bifold instead. Since I had already done trifolds in the past, I thought it would be an interesting route to take. I had to adjust my plans so that my caricature would still show on the cover. My aim was to include examples of all the different types of work I'd created, from illustration to straight graphic design. As I started plugging the images in, however, I realized that I didn't have room for all of that! So instead I used one "fun" illustration, one graphic design element, and my big ol' head.

The first version of the brochure featured a full color illustration and all computer-based fonts. I downloaded a font from Blambot, which makes fonts for comics. I thought that would go well with the comic-y look I was going for. Critique on the piece led me to believe that a hand-drawn font would look better with my mostly hand-drawn art. I also felt that the illustration didn't jive well with my mostly monochrome color scheme, so I switched it out with some lineart from another project I had been working on.

(click for image)

In the end, I still feel that this is incomplete. Instead of going for the "one of each type" route, I should have found a way of showcasing a lot of different pieces of work. I guess that's what websites are for, though!

What is Graphic Design?

2009-10-19T19:02:00.002-05:00

Is Graphic Design "art"? Like true art, it is definitely misunderstood by the general public. A view of this (very entertaining) video gives one a glimpse of what the layman considers graphic design to be. What many don't realize is that Graphic Design is an integral part of thousands of activities they go through every day. Paul Rand is quoted here as saying, "Everything is design. Everything!" The food you buy, the television you watch, the magazines you read, the buses you ride... Graphic design influenced your decisions to partake in all of these.

You might be asking yourself, "Who in the world is Paul Rand?" I did. Go ahead and Google him. You will see that he has created logos that have been in use by nationally-recognized companies for as long as you've likely been alive. You've never thought about who created those logos, have you? That is Graphic Design. Joshua Porter of Bokardo explains it best. Good graphic design is design that you don't think about. It just appeals to your sensibilities, it compels you to partake in the gifts you are offered without thought.

A gentleman in the linked video stated that anyone with a computer can create design. But we all know that is not true. While laypeople believe that design is as simple as plugging a logo into a web page, we know the amount of thought that goes into each piece that we create. We must identify our target audience, we must create that logo that will please them. We must choose colors that will please them. We must please our clients and our superiors, and we must (hopefully) create a unique idea that nobody in the history of the world has thought of before us.

Whatever Graphic Design is... it is difficult to do it well!

Homage to David Carson

2009-10-08T20:17:00.005-05:00

For this project, we were given a choice between creating an homage to David Carson or Stefan Sagmeister. I chose David Carson because I find his aesthetic to be intriguing. What I find most interesting about David Carson is his apparent disregard for the traditional "rules" of graphic design and typography. I have always had a problem with operating outside of a strict set of rules. He takes a lot of risks with type legibility and color.

I also like the way he integrates photographs into his designs, making them an integrated part of his layouts rather than completely separate entities. Since I am more of an illustrator I appreciate the ability to make a photograph more of a design element than just slapping it on the page. I want to play with coloring over and placing lineart on top of photographs.

Based on the two paragraphs above, I worked on formulating my poster design. I created three thumbnails, though I honestly loved the first from the beginning and I think everyone agreed that it was the best option.

(click for full size)

The other two explored illustrating his use of puns in his work and also the fact that he helped usher in the "grunge" era with his convention-defying, dirty aesthetic.

(click for full size)

I really like how this one came together. All of the techniques I used were observed in Carson's work (photograph integration, coloring/drawing over low quality photographs, making layout guides apparent), but I tried to put my own spin on it. I also used a couple of letters from that hand-drawn font I created :) Dave suggested I offset the lineart a bit from the photo when I was drawing over it, and make it more sketchy. I think both suggestions worked very well.

How I Designed a T-shirt

2009-09-26T22:36:00.003-05:00

For this assignment, we were presented with three possibilities of client. I chose Burger Bank because it's an establishment I've had experience with. As well, it's suffered from some difficulties in the past and needs a bit of an image overhaul.

(click for full image)

The one thing I remembered from my childhood is their mini burgers, and how you could get four for a dollar back in the day. I thought that was pretty neat, and focused on that when I brainstormed for graphic ideas. I also thought they needed a logo of some sort, though I wasn't sure where I wanted to go with the design. I ultimately chose to stick closely to the original logo they'd established for themselves, leaving it to my own design to add interest.

I also played around with the idea of equating the Burger Bank to a blood bank, though that is admittedly not the most appetizing route to travel. There was also the really obvious idea of equating it to a bank that stores money.

(click for full image)

Feedback from my sketches led me to stick with the "bag of burgers" concept, though I added the mouth from another design to it to see how the two would go together. I played around with colors, though I mostly stuck with the earth tones and blue together. I wanted colors that would be fairly gender neutral. I decided to make my third design go down my other avenue, just to see if I could use a simple logo to communicate the point. I think that design is pretty boring and a standard shirt design you would see for businesses around here.

The final round of critiques helped me settle on the solid fill, since the sort of "deco" design wasn't quite clear enough. Someone also suggested that a hand-drawn logo would look best with my drawn art, and I fully agreed. I went back to my design and played with the colors a bit. I changed the lineart to a dark brown so that it didn't contrast quite so much with the other colors.

And here we are!

Critique of Various Illustrator Tutorials

2009-09-16T15:06:00.002-05:00

The first tutorial I viewed was How to Design a Logotype from Conception to Completion. The title makes one believe the tutorial will be more indepth than it is. I do like how every concept of creation is covered, from sketching to management of the "corporate identity," and how a logo must be created for use in many mediums, as well as look good in simple black. However, all of these elements are simply touched on. The step by step instructions for Illustrator, along with the screenshots, are also very helpful. If one is looking for a quick and easy reference, this is the tutorial for you. If you don't have quite enough Illustrator knowledge or need to have more detailed directions, this one might be difficult for you.

The second was Design a Grungy Circular Logo. This one delivers exactly what it promises. Each step is simple and clearly illustrated with screenshots. It also very clearly explains a technique that seems easy to veterans of Illustrator, but completely stumps newbies. The only downsides in the tutorial are the links to stock sites. While those are very helpful, I feel that in logo design, one should be able to create their own graphics for the company identity. Right?

Lastly I explored Create a Silhouette Logo for a Steakhouse in Illustrator. I was immediately pleased with this tutorial because he expresses the fact that you should use your own material! See, I was totally right in my last paragraph, this guy says so. He explains how to use real reference materials to create pleasing logos in Illustrator. Each step is spelled out in clear and concise wording. However, being a visual person I would have liked a little more screenshot action on this one.

The History of Graphic Design

2009-08-31T23:15:00.002-05:00

Surprisingly enough, Graphic Design started out in the neolithic era. The peoples of that time sought to do the same thing designers do today: fulfill a need and express a message. From that point forward, mankind continued to innovate in terms of visual expression. Civilization as we know it first used visual art to keep track of business and ownership. By Roman times, the arts and typography were used for a wider range of purposes, though they were still at the disposal of only privileged classes. And so they would remain until the invention of movable type made book ownership more accessible to the general public. Eventually artistic expression progressed along with political upheaval, and styles changed and evolved as often as popular thought did.

Personally, I've always had an interest in Illuminated Manuscripts. I'm a big geek for history in any form, and the first time I laid eyes on the elaborately vibrant illustrations in some of these books, I fell in love. The most impressive aspect of these, to me, is the dedication that went into creating each one. Men expended their entire lives doing nothing but copying each page, lovingly, by hand. These days, if someone were to do such a thing, they would be viewed as crazy... But this was a specialized craft that only monks were seemingly qualified to undertake.

The detailing in these pieces is just brilliant. They had such limited resources with which to create those books!

Goals for this Class

2009-08-25T09:54:00.003-05:00

Here goes my first post! I have never used Blogger before, though I always wanted to start up an account. Hopefully I'll learn my way around this thing soon enough.

My goals for this course and for my degree in general are to LEARN as much as I can. "Graphic Design" has always been sort of an abstract concept to me, considering I always wanted to draw comics. I understand creating a product to fulfill a need, but I never researched the means of doing so. Firstly, I want to learn my way around computers much more. I have always been more fond of real media, and so I have tended to do as little in Photoshop and the like as possible. Last year was the first time I had even touched Illustrator!

Secondly, I want to learn more about the business in general. I don't know much at all about how things work and how I would go about getting a bonafide graphic design job! I also need to work on having more confidence in myself. Things like job interviews and critiques have always scared the tar out of me.

A last thing I would really like to improve upon is my illustrative style. My stuff has always been really cutesy, bright and cartoony. I would like to move away from that. I also have a pretty strong "anime" look to my work that turns a lot of people off. Despite these things, I do feel I have a unique style that defines my work and I don't want to move TOO far away from that.