Posts Tagged ‘business’

Business Cards

Tuesday, May 19th, 2009

I got my business cards done through Manitoba’s only London Drugs. It was apparently Clint — the photo-station manager — who printed them up, and he did a good job. The quality is very fine, the margins are where they should be, and they’re all very straight-edged. There’s a bit of a colour bleed, or something, but it’s so small I had to turn the card around just to make sure it wasn’t my eyes doing it. Someone with sharp eyes and a feel for colour will get the distinct impression that the lower left edge of each letter is blue, but it’s not distinct enough to actually see it. In other words, only ninjas would have a problem with this card.

The card itself isn’t printed on card stock; rather, the set was printed as if I got a whole bunch of 2″ x 3.5″ prints. I could probably make 4″ x 6″ business cards, too, but I’m not sure I’m really crazy enough to do that.
So if you flip the card over, it says “FUJIFILM” and “Fujicolour Crystal Archive Paper.”
What does it mean to have them printed as photos? None of those CMYK circles all over the place. The set of 50 cards was $10 ($0.20 each), but cheaper business card retailers can be incredibly hit-or-miss. Also, the first thing I notice is how tremendously black the black is — it really does stand out. I chose a matte surface, so it’s all textured and shiny. The contrast is absolutely perfect.

I love them.

Designing a Website, Part 1

Thursday, May 14th, 2009

The design of a website is an amazing thing, so I thought I’d share some of my method when it came to developing my new business site, Cozy Cabbage. It’s not complete, yet, but I’ll link when it’s finished.

The first thing I wanted to talk about was the content.
When I was writing about myself, and about the sites I’ve made, and drawing up what it means for someone to employ me (in a much less hokey-sounding way, of course, than it seems as I write these words right now), I realized I hated to use ‘I’ in my sentence structure. I suppose there was just something a bit too personal, in that; something, also, that might suggest very human flaws. On the other hand, I couldn’t exactly say ‘we’ and ‘our’, because it was only me.
In the end, I settled on using none of that at all, and I realized how fun and challenging it is to write something like that. “My services include–” No, I can’t say ‘my’. I say things like, “Work is done on a weekly basis,” instead of, “I do work on a weekly basis.” This shifts the active noun to the work, instead of to me, which I think really brings it out. It’s one of those things I hadn’t consciously noticed until I did it by accident.

The rest of the content is pretty simple: A very brief description of who I am, just in case people want to know. They’re there to find someone to make a webpage for them, so I’ll get right to the details: Samples, to let them know what kind of work I do (nothing great, at the momet — I have to completely redo a site I haven’t touched since last year), then what I’ll do if hired. I’m then adding a longer ‘about’ at the end, which outlines my work ethic and personal co-operation attitudes. There’s a little footer with some legal whatevers. On the top of the page is my logo, title, and three links: The main page, sample sites, and my HTML business card. In place of a contact sheet, I have a buy button. The buy button just won’t do, past this moment. I’ll end up making an actual order form.

On the design end, things were a bit different and mostly mundane. The original idea was to use cabbage and make the site ‘cozy’. I’m not sure how I intended to make it look cozy, but I’ll probably end up trying within the next couple of days. For now, it’s somewhat fresh and not too shabby. The site is very vertical, with improper use of sections below the header, and no sidebar, but I’ll probably get around to that next.
Overall, I just had a bunch of trouble with those floats, which you may have read a few days ago.

Another thing I want to talk about is fluid widths. I haven’t started on grids, yet, but there’s always been something disagreeable with fixed widths. Lately, I’d been keeping my browser at 640 wide, because I can easily set the window to a third or a half of my screen. Once I started looking at all these design blogs, it became quickly apparent that I’d have to switch to 960, though I still have a small horizontal scrollbar.
So I’ve decided that even 800×600 is too large, and it should comfortably fit down to about 300 pixels or so. I end up using variations on max-width and min-width and width percentage, which ends up giving me a great deal of control. If I wanted to use several divs inside each-other, I could even give the box a tremendously flexibly design. I could probaly make it shrink or grow as you increased your browser window. The next step would be to strategically place floats so that you get an extra column if you have a wide enough window. At the moment, you just get some more whitespace, which is always welcome.
I also try to keep my images scaled, because I don’t use full-page zoom, and want to design for others who don’t. The problem with this is images that have percentage width can’t seem to scale with text. I’ve been trying to work my way around it, but I may just have to choose one or the other.I could possibly set a maximum size with an EM-sized div, and then size the actual image with percentage. The max-size on the image, of course, would be set to about 200% of the image’s file dimensions, so it doesn’t become too grainy.

And I haven’t even started on the event layer, or whatever javascripting is called. I’ll also put some server-side stuff in, as well.

I’m researching Python and Django. It looks interesting.

Business Cards

Tuesday, May 5th, 2009

A couple days ago, I saw two business cards laying on my mom’s desk. One was for a dentist, and the other was from some sort of hair salon. A quick look revealed that the dentist’s business card had a logo with simple shapes and soothing colours, a clean finish, dithered CMYK inks, clean-cut edges, a good weight, and well-positioned elements. The hairstylist’s card, meanwhile, had an unmemorable logo, was printed from a poor-quality printer (which left everything slightly smudged-looking), was printed on tear-along-the-lines printer stock from an office supplies store, and had elements of dissimilar style centered down the card. The images also had pixels sticking out.
It’s tremendous how the fine quality and subtle hues of a professionally-made card set it immediately apart from something home-made. I imagine people forget that their printers might print at 300 dpi, even though their images are saved at 72 dpi. Pixels, JPEG artifacts, and smearing are all things that are completely unacceptable, and which are instantly recognised by a great many people.

I’ve designed a few business cards, each one better than the last — and all of them mediocre at best. I also had the job, once, of designing a little 1-inch-by-3-inch advertisement for the local news pamphlet. It started out fine, and I was left with what I saw as an acceptable product, as I viewed the large text on my thousand-pixel-wide photoshop image. I tried to zoom it down to approximately the size it would end up being, but the program would have trouble rendering the fonts into the space of a few pixels — my screen’s density was just far too low. Even with the chopped up characters, though, I could easily see that the text was far too small, and everything was too squished. I scaled everything up, until it looked fine. I sent it off to print, but when I saw it in the paper a few weeks later the text was still smaller than most of the other ads. I had crammed too much content into too small a space, and I wonder if I had missed an older customer because of that.
Lately, too, I was trying to fix up a couple things on my current client’s business card, and was having trouble showing him how it looked. He had designed it in a portrait view, which means only half of it fit on my screen at any given moment. If I shrank it to half size, at which point it fit, some of the smaller details, such as thin lines, would become anti-aliased or disappear.

I decided, then, that there was no reason I had to use an image-editting program. I could created a page in XHTML and style the elements with CSS.
I started, of course, by creating the area of 3.5″ by 2″ at 72 dpi. I sized everything in ems, so that I can change the size to whatever I want and everything will scale. The text, of course, will scale unendingly. I had an extremely large version of my logo, so I used that in an img element. Background-image wouldn’t work, here, because I wanted to be able to set the width and height.

While I was designing my business card, I kept an eye open for lessons. When I started arranging the company name, the tagline, my name, and the contact information within a series of header elements, I quickly realized the pixelated structure of importance denoted by h1, h2, h3, h4, h5, and h6. I’ve always known about them, of course, and used them in my pages, but it wasn’t really until this moment that I truly understood their importance in communicating to the user which piece of information is given priority.
When I saw this, a couple questions came floating along: Which is the most important? My company’s name, obviously. But what about my tagline? Is that more important than my name and job title, or less? Is it alright to decrease the font size of my tagline to keep it the same width as the company’s name, or would that send the message that it’s less important?
Even then, that’s just one facet; The shape and position will also draw certain suggestions around them. I haven’t really played with fonts as much, this early in my career, but I’ve seen how others use them. You can use a font to emphasize an element at the same time as you make it smaller, which helps with positioning. I think that’s one thing that drew me to design: You have such a tremendous range of completely different attributes that you can apply to each element, and each one has the power to change the perception of that element. What you’re left with is the equivalent of tossing spices into a soup: Too much and the soup can’t be tasted through the spice, while too little leaves the soup bland. A tremendous difference is found between cooks who know how to spice their food and cooks who don’t.

I like the spacing on the card, but there was a moment where I decided the city/province/country just wasn’t important enough for the card. I did keep the city and province, but stuffed it in the corner. I find it actually helps balance the elements a bit, too.
Other than that, there were the tricks of getting everything to line up how you want. I saw that my text naturally flowed around the shape of my image, so I kept those nestled.

And now I’ll try to use what I made in that twitter post a few days back:
My very own business card, fitted with hCard.