torunn's blog

End of an era!

So, I’ve been meaning to write this post for a few weeks now, but as I haven’t had the details sorted out by now I chose to keep things more quiet. But, on the 30th of March I chose to step down from my position as Head of Design at Orange Bus. It’s been almost three years, I’m the longest serving employee (who’s going to beat me?) and it’s definitely been tough times and fun times. But, it was my first ever encounter with the professional world after university and I feel like I could do with some experience elsewhere.

I’ve not actively been looking to move on, but when the opportunity arose I felt like it would be stupid not to explore it more. So, on the 24th of May I’ll be taking on the role as Lead UX Designer at Cravens Advertising. It's a new position where I will be forming my own role, just like I did at Orange Bus when I first joined the team. I’ll be bridging the gap between the digital team and the creative team, and for a design hybrid like myself that’s pretty ideal (some might say sickeningly ideal!)

I need a new housemate!

My housemate Eline is moving out on June 11 to go back to Norway (good choice of country!) and I'm in need of a housemate to hang out with in this lovely big house in Spital Tongues (Just off the mini roundabout on Claremont Road). It's an old Victorian building which is within walking distance to town (10mins from Haymarket) but still tucked away from traffic. There's a lush garden, big kitchen and dining room to host Come Dine With Me parties downstairs, and a lovely and light sitting room upstairs. The room is en-suite, with a stand alone bath and a fantastic shower and plenty of wardrobe space.

It's non smoking, but yes party!

DM me on twitter if you're interested on www.twitter.com/fuselagetown

Some pictures

Bedroom

Dining room - with bikes for the time being

Kitchen island

A neat way to create sprites with multiple matte colours - which pleases Internet Explorer!

At Orange Bus we're strict about following best practices, and in my day to day workload that pretty much means perfect mark-up and optimised graphics.

I've covered the importance of using sprites rather than separate files for web graphics before, and we follow this practice on all the sites we build. For me it's not all about making the download-time faster for the user (although that's a must!) but also a unique timesaver - it makes the maintenance of the site, and the build of the site (not to mention browser compatibility) much much faster. It never fails, a client will ask for minor tweaks when you think you're ready to launch a site, and for me to be able to open one file to alter all the graphics is much quicker than going through an endless long folder of small 1px files is vital.

High Dynamic Range Imagery

You've probably already seen some very insipring HDR photography out there on the web, as it's not a new technique - in fact the idea goes back to 1850 (!) - but it's become more and more common, especially now when many people have their own digital SLR camera.

I'm quite a keen photographer myself and thought I could share with you how to do a quite simple but in most cases will give you a great result!

Step one - Camera settings

You will need a tripod, or at least balance your camera on a steady surface. In the settings on the camera, set the AEB (auto exposure bracketing) to -2 and +2 (google AEB and your camera brand to find exactly how to). This makes the camera take 3 images when you hit the release button; one with normal exposure, one under- and one overexposed. For best result, choose to take your pictures in RAW rather than JPG. RAW stores much more information.

Smoke Central

As a web designer, it's often required to make nice header graphics or background, or even design feature boxes which might contain boring data. I'm not going to say that Photoshop can't do this, in fact there's pretty much nothing you can't do in Photoshop CS4, but a good photograph can help you on the way to a more abstract look, which is exactly what this experiment proves.

I've always thought that smoke creates amazing shapes and shades, and I was pondering how to capture this on still images, and this method is the one I found to work best.

First of all, a dark room is required. I used a 2 meter long table, placing the candle on one side and the camera on a tripod (this is essential to get the focus right) on the other side. Use a spot light to cast a bright light on the smoke only.

My equipment is a Canon 40D with a EF50mm lens with a max aperture value of 1.4, which is great for this purpose. It leaves the focus only on the smoke, whilst the background (if there is any) blurs nicely, exactly how we want it.

The camera is not able to use the Auto Focus (AF), so to get the focus right use manual (MF), or alternatively make your assistant (in my case my mother) hold an item in the area in which the smoke will appear, use AF to get the focus right and then set it to MF before shooting.

Best CSS based horisontal navigation

I've spent quite a bit of time researching how to build the best horisontal CSS navigation, and I believe I've found the perfect method, which I now apply to all of my work - thought it would be a nice thing to share.

The Markup

When developing in Drupal (as we do) one would use the primary and secondary links in the admin to create the navigation, and it looks a little something like this:


<div id="header">
	<ul class="menu">
		<li><a class="active" href="#">home</a></li>
		<li><a href="#">about</a></li>
		<li><a href="#">blog</a></li>
		<li><a href="#">press</a></li>
		<li><a href="#">shout</a></li>
	</ul>
</div>

New bands on the block...

Nice little task from my good friend Sissel, which goes a little something like this:

What would your own album look like if you were in a band?

Here are the rules:

1 – Go to a random Wikipedia : The title of this Wikipedia article you get is the name of your band.

2 – Go to Quotations Page : The last four or five words of the very last quote on the page is the title of your first album.

3 – Go to last 7 days Flickr : Third picture, no matter what it is, will be your album cover.

4 – Use Photoshop or similar to put it all together.

5 – Post it to your blog!

Integrating Twitter with Drupal (apologies for the geeky post)

Right, so I was going to write a little how-to for people that want to integrate their Twitterfeed in their Drupal site. As I tweeted yesterday; it was just TOO easy...

Step 1: Get your code right

Assuming you already have a Twitter account, the first step is to go to Twitter Widget Chooser, tick for HTML widget and click continue.

I'm a mac!

It's been too long since I've blogged. If I'm ever going to be the Norwegian equivalent to my hero Veerle Pieters, I can't be slacking like this.

First things first - I'm better equipped than before! My dearest MacBook Pro collapsed just before Christmas break, and we were barely able to get my documents across to a borrowed laptop in time for my flight. I was on the verge of crying actually, which is odd as it is only a computer - but it was my first Mac and we had shared some good times together playing with pictures. After a few hours of mourning and a large glass of wine at the wake (..or airport bar!) it was time to get stuck into this newer and better MacBook Pro which runs on Leopard and everything! And I have to admit that I've probably been driving my old computer to its absolute maximum, it was constantly over-heated and running exceedingly slow whenever I had several Adobe packages running at the same time (which I always do - command Q is not in my vocabulary). You can tell that you need an upgrade when your hands can type the shortcuts faster than the machine can execute them. CS4 runs like a dream on this new machine - the slick zoom enhancement is always spot on, nor does it mind that I flick swiftly between the ten to fifteen applications I've got running. Life is good!

The start of a new era: Creative Suite 4!

It's a great time to be alive, and being a designer - Adobe has released CS4 and when they toured with a pit stop in Newcastle, fellow designer Maryam and myself could not refuse the invite to come and see what they had to offer! I went to their CS3 tour last year, so I was expecting to be gobsmacked, but my oh my it is definitely their biggest release so far. It's been a good while since Adobe bought Macromedia, and we can really start to see how they integrate so well with each other - even as a designer you can do the most amazing Flash things without writing any Action-Script. I'm a dab hand in CSS and HTML so I don't necessarily mind writing code in a different editor, but for a non-coder like most designers, the integration between Photoshop and Dreamweaver is just outstanding. Perhaps it's a good thing that I was taught mark-up from scratch, by the looks of it people mightn't even bother with that in the future.