Category Archives: Website Design

Process, Inspiration and Practice for the New Media DesignerI just received the book MTIV: Process, Inspiration and Practice for the New Media Designer by Hillman Curtis I skimmed through it and caught some insightful words:

A common mistake of designers is thinking of themselves only as visual communicators. We’re fortunate to speak the visual language fluently, but we also need to translate literal and thematic messages. In other words, we need to be bilingual. As a designer I need to listen and ask questions… …without (that), I’m as good as blind.

I’ve talked a lot lately about branding myself as a designer, so it was nice to hear what Hillman had to say about it. I came across the part where the author talks about designing his design firm’s website (hillmancurtis inc.) Hillman had some insightful words:

My thought was to design something bold and cutting-edge, so I studied the work of my peers: designers who I thought were doing new and exciting work. Still nothing was working. The designs I turned out fell flat, and every night I went home empty and depressed.

He goes on to say that his wife told him about a poetry conference she went to at which C.K. Williams said that when he’s creatively blocked, he falls in love with a master. He looks back to those who perfected their craft and takes cues from their mastery. For designers, that might be Paul Rand, Saul Bass and many others.

Who are you looking back to, that perfected their craft?

One of my new clients needed a logo, banner (6ft x 4ft)) and website. I’ve got a prelim. website done. This website led to another website project that I’ve not even started on. It’s for another drug prevention organization.

Now if I could only balance this work with my internship.

 

I’ve got website projects in all stages of production. A recent website project for Truman Media Network (TMN) is being programmed right now http://transfer20.truman.edu. My goal for TMN was to make it very accessable to visitors. I took many cues from CNNs website.  Also this was a test in “making a website with an existing logo that isn’t very well designed” The best thing to do is to use much whitespace around the logo and let it stand for itself, and don’t try to hide it with texture background or large graphics near it.

My two websites for my portfolio are now done. The two clients I decided on were a church in st. louis and a blues guitarist The audience for each is drastically different, and I hope the design depicts this. There’s also a mini-site for the church for their three week message series titled “Questions” With the blues guitarist I tried making it distinctly different from another guitarist website I made.

I’ve got another freelance client that wants a website, logo, brochure, banner for their drug prevention coalition, Putnam County Partners in Prevention. This will have to wait until after finals week in order to start brainstorming.

Meadow Heights also needs a website redesign, which I need to get done with… Why do I never have enough time for everything? haha

Today I presented in Advertising about a proposed “Students for McCain” website that Anshu (group partner) and I felt was needed for McCain. The website is here. I suggest watching the videos, especially the one about everything that is younger than McCain, such as the golden gate bridge, velcro, mcdonalds… and on and on. Get this, Dick Cheney is even younger than McCain.

Another website/poster campaign that just went live is for “Information Security Awareness” This has been a semester long project to create posters and the website.

In about a week I will be moved in near Des Moines, preparing for my first day of work at August Home!!! SO EXCITED.

  1. Websites should look pretty and that’s all that matters.
    They should be well designed, but from a usability standpoint. It’s not a magazine ad, where the audience just looks at and reads it. Think about how the user will navigate through the site, their Internet speed, browser support, search engine optimization.
  2. I don’t know HTML so I’ll just use Flash to build my website.
    If it was 1999, maybe this would fly, but not today. Building websites purely in Flash is a misuse of Flash and an alienation of web useres. Flash is a motion graphics program, not a website editing program. Flash is meant to enhance  well programmed and designed websites. You will alienate visitors because they won’t find your website in the search engines. What about your grandma? She might not have the newest browser or Flash player which will allow her to view your website.
  3. I’ll welcome my visitors to my website with a “click here to enter” page. (see the screenshot)
    This is usually only done with Flash websites, but this is the silliest thing someone can do. By typing your web address in, it is a sign that they already wanted to “enter” your website. Keep the front door open and let them land right there in your living room, aka: your full homepage. Even if this page is only here so users know they need flash player to view the website, they most likely not going to take extra time to get the flash player just to view your website, unless it’s your very devoted mom.
  4. I’m using tables to lay out my website, because I just don’t get this new fandangled CSS thing.
    The Internt began as a way to present and transfer content in purely text format, with no layout needed or required. Tables were added shortly after so that tables of data could be displayed. Then someone decided that they could use a table to design their whole website. They even began nesting tables inside one another to create their complex web designs. Tables are to be used for “tables” of data, and CSS should be used for the layout and styling of a website . Cascading Style Sheets separate the design from the content. This means that when you want to redesign your website in a year, it will only take a few minutes. For example, I recently changed color schemes on my approx. 50 page portfolio website and it took about 10 minutes. If I was using tables, I would have had to open each of my 50 pages and change colors manually. I admit, in high school I learned to use tables, and it took 6 years to make the switch, and what a change it has been.
  5. Image maps are the best thing ever! I can create a website in seconds!
    What about visitors to your website who are disabled and use a screen reader? When they visit a well programmed website, the contents of the website is read to them out loud by special software. If your website is primarily image-based or even Flash, then all the disabled visitor will hear is silence. You can also alienate your visitors with dial-up Internet, because they will wait many times longer for your website to load. I will admit I’ve used image maps. Just check out http://www.sargent-construction.com The whole circle motif is an image.
  6. I just make my paragraphs of text images so that the user will see exactly what I want them to, in the correct font, size, and color.
    It is true that the user might see a different font or size if you use real text, but that’s part of the beauty of the web. The user can decide, via their choice of screen resolution, font size, etc how they view your website. By making your text an image, you take that right away from the user, while also blocking that content from search engines and slowing the load time of dial-up users.

These ideas are ones I’ve spent eight years learning. I’ve made all these mistakes at one time or another, either for my convenience or because I truly had no idea what I was doing. The biggest idea above that can actually be a good thing to do would be ‘all flash’ website. For product promotions and mini-sites, it is definitely appropriate to use primarily flash, because you want to sell the product with a “flashy” design… Pun intended But if you are creating a corporate website, or even a band website, think about search engine optimization, usability, functionality etc.

The era of ‘pretty websites’ has passed. People now demand more usability, interactivity and functionality. If you can create a well designed website that is usable, functional and interactive, then you’ve figured something out.

 

homepage001.jpg
I’m currently doing a freelance design job for the City of La Plata. Their website was in great need of a redesign. Check out a designed simulation of the homepage here. Currently, I am in the programming stage of this project. Website projects usually start with a discovery stage which involves meeting the client and finding out exactly what they want and who their target audience is. Next, I create a website design via Photoshop based on the discovery meeting. I then get their feedback based on what they feel will be a website visitor’s responses. It is important to ask not what “they” think of it but what their target audience will think. Personal preferences should never have a place in this stage, unless it is their personal website (even then, it is still about their audience). Then I get design sign-off and approval to go ahead with the website programming. After programming, the client should have a few days to look through the website as it will be when it goes live. At last the website is uploaded and live!

I got to shoot some photography for this project. Since it is for a small town, I took my camera down to La Plata and just drove around taking photos of their little town and all that it has to offer. It had just snowed the night before and made for some great photos. Look for them soon.

I was stopped by a fella while taking photos and he asked if I was redesigning the website (that’s how small the town is… everyone already knows me). He runs the Pulp Museum (the author of Doc Savage was born in La Plata) and is interested in a website for it. Funny how work just falls into my lap.

Latest Website Design
I recently posted this in a contest that was later cancelled. I’m begining to enjoy creating website for practice. I can mess up and learn from my mistakes while waiting for another website job.


video editing company

Latest Projects
I recently worked on a very cool Flash project for Truman State University’s new website redesign. They wanted to have a photo slideshow on the homepage that could be dynamically created through a web form. Basically anyone can upload a photo, a caption and a link to the website/story corresponding to the headline/photo. When this form is submitted, the slideshow will automatically include the photo with caption/link

The project is here

I am by no means a programmer, but I work with another student who is. He did most of the programming and I did the Flash aspect of it. If you were to look at my Flash file you would see nothing on the “Stage” because everything was done with Actionscript, Flash’s scripting language. Strangly, Actionscript is very similar to Javascript.

Here’s a breakdown of what we had to use/implement:

  • Flash Actionscript which creates dynamic movie clips.. including code that would set a drop shadow, embed the correct font and set the placement of the text on the photo
  • A corresponding XML file that Flash pulls info from… this file also specifies the length of each slide, and how slow the fading occurs
  • An ASP email form/upload script which dynamically creates an XML file by first storing the data in a database

This is truly what Flash is meant to do. It isn’t meant to make meaningless welcome pages. The next generation of Flash is to incorporate ASP, PHP, Databases with it. No more of these pointless animations and all-flash websites.

Blast from the Past
I don’t know why I’m posting my design work from high school. If only to prove a point that Truman State University is teaching me something about design. I was a senior in high school when my then band director requested I design his website for his political campaign.

This was my first website job.

Notice my inclination for good typography… or lack thereof. I used drop-shadows and edges/strokes on all text. I used a script font, I used a pointless “welcome message”

All these are what I now know is generally bad to do.

You live, You learn.


website job number one

I won’t blame this on the software I was using, but it definitely didn’t help. Anyone ever hear of Microsoft Image Composer? It was shipped with old versions of Microsoft FrontPage. It is what I used until entering college and being forced to use Adobe Photoshop.


farewell dearest Image Composer


You’ll be missed

This program didn’t have layers, channels, pen tool, etc. It was essentially one layer and you could only “undo” once.

Only one undo.

You Photoshop guys wouldn’t survive in the world of one undo.

I survived.

On the (Photoshop) Drawing Board

gecKo mathematics

  • I’m working to complete all the secondary pages for this website, then I need to brainstorm ideas for how to present a math workbook online so that parents and teachers can see the teacher manuals and student workbook all on the same webpage. For all you teachers out there… I’m trying to create the online equivalent to a teacher edition book. The solution will be and should be much different than the typical wrap-around column with teacher notes on the outer edge and bottom of the page. Webpages aren’t print documents and can’t handle a very wide layout.
  • A gecko illustration is also needed for use on the website.

Worship Concert 2007 @ Meadow Heights

I get to create everything from website ads to the bulletin to the powerpoint slides. I still have the bulletin and powerpoint slides left to create. Here is a sneak peak:


website ad


front of the bulletin (8 1/2 x 11 turned on its side with the fold on the top)

Agricultural Science
I’m currently templating and programming the tertiary pages of the current website. I basically copy and paste the content from the current pages and put them in a blank webpages, then view the code to delete all the extra formatting that I’m using stylesheets for.


A screenshot sneak peak

See them live!
Homepage, Secondary, Tertiary

Korean Math becomes gecKo mathematics
The Korean Math project that I spoke about previously has sort of warped into having it’s own identity. The new name is ‘gecko mathematics” Why, I don’t know. Your guess is as good as mine.

What will happen when a possible sponsor asks what the concept behind the gecko is? We won’t have an answer… unless we say the truth which is,”because the professor’s grandkids like gecko’s.” This situation has confirmed to me the importance of a concept, even if it’s a simple one.

The website design that I presented previously is now programmed, thanks to my 4 hours of work. It is located here.