For the menu I wanted a mix of both dynamic and static elements. I some of the categories I wanted to show the latest posts underneath, in another I wanted to show links to the sub-categories rather than the posts. And finally I wanted some to link to static pages such as “contact”.

Another thing I was quite specific about was having the correct font for the category titles. The reason I wanted this was because I wanted full control over how the page was displayed cross-browser and cross-platform. This way I could be sure that what I designed was what people would see (whilst this might seem an obvious choice it happens far too often that websites are coded poorly and don’t display similarly in different browsers). As I used Helvetica when designing the website in photoshop, I knew I would have to convert the titles to images that would then be loaded on the website – this is because Helvetica is not a standard font, which would result in the website rendering differently on computers that don’t have Helvetica installed.

Continue reading »

During the relatively short course of this subject, I have been asked several times about how you take your photoshop-design and actually implement it. Back when I started designing websites I remember this was one of the things that caused me the most trouble. This was probably due to the design-oriented approach I came with – I was more interested in creating the designs themselves than learning how to code proper html.

I tried lots of poor solutions such as photoshop’s “export as html”-function and Microsoft’s Frontpage. But first when I learned how to (more or less) properly code and structure through HTML I was able to integrate the photoshop layouts properly.

In the following article I will show you, how I undergo the process of taking my photoshop image and creating a functional website out of it.

Continue reading »

For the “logo” I wanted something really simple that at the same time served a purpose and reflected the core idea behind the blog.

My initial thoughts were that it should serve as a button (link) to the front page, so I played with various round circles which I thought seemed most intuitive for a button. I had during the design process also been very keen on creating something that was iPhone-friendly, hence the rather simple layout with a continuos stream of posts. This lead me to increase the size of the logo so that it would make browsing back to the home page easy on a iPhone – as well as seem more iconic when viewing the page as a whole.

Continue reading »

The first step of the physical creation of my website was creating the visual layout in photoshop. I lay down a few guidelines when undergoing this process, first of all I like to define the precise sizes of the different elements in whole tens; for instance the posts are 600 pixels wide – I find that this makes things a lot easier when coding it, and ultimately results in more consistency.

Secondly I set up guides in photoshop to ensure that things are perfectly aligned, this usually doesn’t mean a lot for the future processes but if needed, it’s far easier to have done these things precisely to start with.

Continue reading »

This is the second version of my wireframe, I went for a more “traditional” blog layout. I rethought the concept of my blog and what it should contain, and ended up concluding that I wanted too much with my other concept – however this doesn’t rule out the future opportunity of integrating this blog into a more extensive website.

Continue reading »

This is a VERY quick mockup of my initial thoughts for the structure of the main page for the new design.

The idea was to have new entries represented by small thumbnails which would obviously link to the full entries with a large view of the project + description. In my mind this layout would function more as a portfolio than an actual blog – which I find preferable due to my personal lack of motivation to run an actual blog.

I previously had a photoblog running where the goal was to post an image each day, however the activity quickly declined and I was unable to catch up with the number of requests of entries whilst maintaining, what I found to be, an acceptable standard in quality  - based on that observation / experience I found that I’d rather have seldom posts with more effort put into them, than a frequently updated blog-like concept.

Continue reading »

This is the original blueprint from which my concept is based. On my current website I have 2 main divisions, namely photography and web design. This has been bothering me through a longer period of time, and whilst keeping the two apart is easier in a design context, it does not encourage updating, as well as it might be the cause of some confusion for visitors.

Therefore the idea is to have the blog function as the outlet for all my creations, a stream of photographs, web designs, wallpapers, and hopefully movies too. Therefore the blog needs to have a simple indexing function that will make browsing seamless, but it will also need a versatile design that will “adapt” to the content displayed and support the presentation rather than being the presentation.

Continue reading »