Identity design for wilderness survival company. They provide training for rugged-types interested in learning how to survive in the wild. I was responsible for choosing the name as well and researched Canadian geography and northern foilage until I discovered the town of Resolute in Nunavut which I think perfectly represents the company. By definition it means determination of spirit and it also connotates isolation and resolve.

I wanted the identity to have a slightly vintage but definitely wintery feel. The logo can be separated for versatility, as shown on the home page mock. The identity design is very minimal, to convey a feeling of isolation. Large images of Canadian landscapes with vintage photo-filter treatment.

elainestam.com/resolute.html

As I mentioned in my last post, the guys at work get really into new trends in web design and I swear every 5 minutes today I heard the word parallax. Basically it’s using scrolling functions to create layering effects with CSS3 & jQuery.

If you haven’t seen what this is yet, click here and check it out. Shown above. And that’s just a site for some barbecue restaurant in Atlanta. The most un-lazy web designer ever I think!

This Nike website (above) was apparently one of the first to come out using this technique.

This one here (above) is my favorite that I’ve seen. He has used it in very small doses and his design is amazing. Beautiful.

I am hoping I come across a new project soon that I can implement some parallax details into.

Well, mainly because the guys at my work say the word responsive every 5 minutes I decided I would rebuild by site with a responsive design. Now they are already onto the word parallax but that’s another story. I’ll have to write something for my blog about that next, I have too much to say about that for tight now.

Anyhow, for this re-design I found a Twitter Bootstrap CSS template that I used as a base and built it up from there. It was challenging because it really limits how I show my portfolio pieces. I couldn’t just place images in the main image area because there is no way to have them scale all the way without having the background drop off when the site is opened up large on a desktop. There are still a few things I would like to change when I have the time but overall I am content with it. 

And if you are reading this and not a web designer the term responsive means that this site will scale itself in a fluid fashion depending on wether you are looking at it via your desktop, tablet or mobile device. See the image above to see what I mean. Oooohhh.

Johanna is a friend of mine so naturally I pestered her to have her own website, as I do with everybody I know. She has a successful doll-making business, Charlotte & Stewart but didn’t have a website to showcase her illustration, graphic design and textile design work. This website will allow her to show her many areas of talent and pursue a career in her new city.

Like I said, Johanna is pretty handy so she designed her own logo. She sent it to me to review and I created two options for the home page identity and layout. 

We combined elements of both designs I presented to create this really clean homepage design. The notched corner provides some interest and was inspired by her logo’s font style. The striped background provides some colour and interest but doesn’t distract from her designs.

Her gallery pages are equally clean and easy to navigate.

Clicking on any image will pop open a larger image with arrows to navigate through all images from the same page.

A fun project with a great result. Thanks Jo!

www.johannachaytor.com

I met with a colleague the other day and we were discussing wireframes and how information architecture (IA) really interested us. I never really thought too much about this topic before. I know that I like it because I like organizing content and finding the most effective way to present it to appeal to a user on a website but I never thought about the process of wireframes and their value. 

As much as a website needs to be visually appealing, it needs to communicate quickly and effectively it’s message. The user cannot be bombarded with everything you want to showcase on the home page, a common issue I have with a lot of CMS sites. It is key we first understand the main goal of the website and then structure it appropriately. I find this is easily accomplished over a cup of coffee with my client, or an emailed project brief if a face-to-face meeting isn’t possible.

Once I have an understanding of what I need to communicate I will start on my wireframes. I used to just sketch out my layouts very quickly, eager to get to designing, but when I decided to take the time to create wireframes in InDesign I was thoroughly impressed with the result. Not I not only have a professional set of wireframes to send to the client to approve, but I have a really nice road map for which to start my designs from. My design process is now becoming much more effective as I can strictly focus on my designing and not be bouncing back to thinking about layout and site structure all the time. 

Here is an example of a wireframe that I just created. It is for a record label website. This is the most content-heavy page, for the individual releases page.

New identity and website design for Toronto concrete flooring company, Floorlab. The identity was updated with a new clean logo with grey tones and modern bright green. The website is fully search engine optimized for maximum online visibility.

Logo design

How identity presents on stationery

Home page of website

Gallery and services pages

View the website at: http://www.floorlab.ca

Clients are becoming increasingly more web-saavy and are asking me about how to rank higher in Google. This is great. I think every website should be designed to be found and ensure I build mine so that this is the case. I’ve never charged extra for this functionality because I believe in it and will always include it in my websites. I was working for SEO company at the same time I learned how to build websites so it’s automatic for me. 

Search engine optimization (SEO) is the process of building your site with certain details in mind (I’ll explain more on this later) to ensure Google’s crawlers find your website first and foremost when your company or service is searched. There is nothing more frustrating for me than having to search and search for a website of a company I am interested in. I want to give you my money so you should make it easy for me to do so.
Furthermore, if there is a service I am interested in and don’t have a specific company in mind, you better believe I am only going to investigate the first page of search results Google presents me. You want this to be your website. 

So, what do you need to include in your website to have it deemed ‘search engine optimized’? Well, there are about 10 things that I standardly include but you can really max it out with many layers of SEO if desired. In the actual coding of your website is where about 50% of the SEO occurs. It gets pretty technical to explain so I won’t get into this. It’s pretty geeky stuff. The other 50% is in the content. This is where I stress the importance of effective copy that contains ‘keywords’ that people might enter in Google to search for your service. The copy then has to relate to the keywords that have been included in your coding. You have to trust your web designer has been doing this properly or else it’s not going to work. 

Another thing I like to see on all of my websites is a blog. I am really liking Tumblr as it is free, very customizable and the interface is really easy to use. They even have an app that you can use to upload photos on the fly. So your blog will ensure your website is staying current with your SEO rankings as well as keeping your content new and fresh for your users. 

Well, that’s my short story about SEO. It’s perhaps one of the less glamourous parts of your website but without it it’s possible nobody is going to see your site. Make sure when choosing a web designer you hear the right questions being asked and that they are aware of current best SEO practices so you get the results you are looking for.

Just finished an update for my friend Celine’s website that I maintain for her. It’s amazing to see how her photographic style is evolving; she is a very talented lady!

Check out her work on her website or her Facebook page.

Well, I now have three websites in progress that I am waiting on client final approvals for. This latest one, Palmerston Painting, is waiting on me to construct it. I am hoping this week after the Hey, Sweet Stuff build is complete I can start it. Anyhow, here are my two identity designs presented for client consideration.

The existing identity that I created 7 years ago has become dated and I felt it was too traditional and feminine for a man’s paint company. So I created one new identity that was traditional (design 1, similar to the original logo) and one that was more modern (design 2). I am really happy he has decided to go with the cool modern one.

Design 1:

Design 2: