You're looking at all articles on The Hickensian tagged 'shelf'

Shelf, now in stock!

It’s been an awful lot of work to get what was on the face of it, a simple idea, finally released. After 4 months of design, development and bug-fixing, my Shelf theme for The Theme Foundry is now available for Wordpress and Tumblr. This is a time of both joy, pride and nervousness!

I’ve been working with Yan Sarazin of Statik Pulse, who has implemented the javascript side, and Brandon Dove who converted the HTML & CSS design into the final Wordpress Theme. Along with Drew Strojny who commissioned the theme, the team has been a joyful experience to work with! I’ve also learned a lot about using Git from this project, which has been an unexpected bonus.

I’ll be doing a more thorough write-up of the process and what interesting challenges we had to solve along the way, but in the meantime, there is a Flickr Set where I’ve been documenting the process, and Drew has a written a post to introduce Shelf.

The start of Shelf!

Drew Strojny from The Theme Foundry (who I knew from his lovely Traction theme) recently asked me if I’d like to create a new WordPress theme for him. The offer-I-couldn’t-refuse was complete creative freedom, and the opportunity to make the design process visible. That doesn’t mean ‘open’ in the sense of ‘everything being up for discussion with the internets’ (that way madness lies), but documenting the steps as we go.

Everyone has a different workflow, and my workflow isn’t necessarily the right approach for anyone else and vice versa. However, I still love hearing others explain their thought process – the ‘Design Eye’ panels at SXSW spring immediately to mind as being good examples.

So on this blog, and on my dribbble account, I’ll be recording what happens as it goes along. Who knows, it might be fun! It’s the certainly the first time I’ve ever done a project in this way.

Before I go any further, I have to know the constraints. Even on jobs with creative freedom, there are still constraints. On this project there are 2 main ones: budget (which is usually the case) and saleability. It can’t be so esoteric a theme that no only my mum wants to buy it!

The next stage was to come up with an idea. Drew wanted it be something that I would excited about, that I really felt motivated to do. My original thought was something along an 18th century nautical theme, inspired in no small part by my love for the Kraken Rum packaging:

I discussed this with Drew, but the conclusion was that this was too esoteric, limiting the potential audience somewhat, which was fine. So I went away and sketched a more contemporary idea that had been brewing:

It involves a shelf (very subtle white/grey shades, not wood) with a series of ‘cards’ on it. The content is put into these cards and their size is dependent on the browser window. Content could be identified as different types of ‘cards’ (article, photo, video etc.) and each of these would have a slightly different layout.

There would be a fixed top nav and footer, and these would allow for different colour scheme options – a very modern grey/yellow but the background yellow and text colour could be interchangeable for any colour scheme.

As the content would resize to fit the height, scrolling would be horizontal. We’re always told to avoid horizontal scrolling, but I love a challenge! I’m keen to see if I can make it work, especially with what will be a fluid, responsive design.

This a theme that could multiple purposes:

  • a Tumblog or Blog
  • Photography or Design portfolio
  • Shopping site

Basically sites with a lot of visual information, rather than text-heavy content. Stay tuned for more developments!

Archives by tag:

2006, 2007, 2012, accessibility, acoustic, actionscript, adobe, advert, adverts, advice, air, alternative, ambient, analog, apple, applecare, appletv, apps, appstore, art, articles, atmedia, attap, audio, australia, authenticjobs, awards, ban, basecamp, bbc, beatles, belkin, bikes, bikeshops, bitmap, blackhole, blogs, bluetooth, bonecho, books, boxee, boxeebox, boxmodel, braindump, breakfastbaps, britain, british, browser, browsers, browsers.mozilla, bug, bugs, cairo, cakes, calendar, camera, camino, casestudies, cbbc, cc, chap, chaps, charity, cheerup, cheese, childreninneed, christmas, cinelli, cms, cocoalicious, coda, code, collections, colour, colourblind, colourblindness, comedy, comments, competition, comps, conferences, copywriting, cotswolds, country, covers, craft, cs5, css, css.webstandards, cycling, danielsmonsters, delicious, dell, design, design.colourblindness, desktops, development, digital, discovery, discussion, diy, dock, doctorwho, dogs, drawing, dream, dreams, dropbox, drwho, education, electronica, email, emoticons, england, events, evernote, expressionengine, eyetv, family, favicons, feedback, femalevocal, figures, film, films, firefox, fireworks, firstworldproblems, flash, flexible, flickr, flock, fonts, found, foundries, foundsounds, fowd, free, freelancing, frontrow, ftp, g5, games, gaming, gardening, garlic, geek, geekends, geekery, geekmediabox, genius, gentleman, gifs, gigs, google, googlereader, grammys, graphics, greader, grids, gtd, hacks, handbag, handbags, hardware, harrypotter, helvetica, helvetireader, heros, hicksdesign, history, holiday, hosting, howto, hp, html5, humanrights, icab, ical, ichat, icon, icon and interface design, icon design, icondesign, iconhandbook, icons, ideas, illustration, illustration/icon design, illustrator, illustrators, im, images, indesign, infographics, inspiration, installation, intel, interface, interfaces, internet, internetexplorer, interview, interviews, inventions, ios, ipad, iphone, iplayer, ipod, itsmyblogandillbangonifiwantto, itunes, javascript, jobs, journal, justabitoffun, koken, leaflets, lego, leigh, less, lifeio, links, list, listening, lists, littlebigplanet, logo, logo and branding design, logo design, logos, london, londonbombing, mac, macbook, macmediacentre, macmini, macs, macworld, magazine, magazines, magazines.illustration, making, maps, mechanics, mediacenter, mediacentre, mediacentres, mellow, memes, memories, menus, merchandise, messages, metal, metro, microformats, microsoft, modernart, moleskine, monkeybutler, moon, movabletype, movies, mozilla, mum, music, myob, natural, nerdery, newmusic, news, nintendo, nostalgia, nostradamus, notes, obituaries, offers, office, offscreen, omniweb, opacity, opensource, opera, organisation, os, osx, oxford, oxfordgeeknight, packaging, panic, panther, paper, parallels, penguin, people, photo, photography, photos, pimp, pipes, plex, plugins, png, podcast, polygamy, posters, powerbook, practice, presentation, presentations, presents, press, print, printmaking, productivity, products, projects, propoganda, ps3, published, punditry, puppetry, questions, quicksilver, quotes, radio, radiohead, raf, railway, rants, rapha, recentwork, repair, resources, responsive, retorts, retro, review, reviews, riffs, rip, ripoffs, rissington, rss, safari, saft, sage, samantha, sass, sauce, science, scifi, scrapbook, scripts, security, server, shelf, shiira, sideprojects, signage, simplenote, sites, siteskin, siteskins, sixties, skinning, skype, slides, slowcore, software, solutions, songbird, sony, sound, spam, speakers, speaking, sponge, spotlight, starflyer59, startrek, starwars, stationery, stevejobs, store, summerboard, surveys, svg, sxsw, syncing, tagging, talks, tasks, tattoos, tea, teasing, templates, ten, texpattern, text, texteditor, texteditors, textile, textpattern, thebeatles, theme, themes, theming, thenational, theory, tiger, timeline, tips, toys, tumblr, tv, tweed, typefaces, typography, ui, updates, updtes, userstyles, vector, veer, versions, video, videos, vinyl, vw, wallpaper, web, webapp, webapps, webbies, web design, webfonts, webkit, website and logo design, website design, webstandards, whitenoise, why, widgets, wifi, wii, windows, windows8, wireframing, wishlists, wordpress, work, working, xhtml, xul, yojimbo, youtube, zengarden, zip

The Hickensian is the journal of Jon Hicks, one half of the creative partnership Hicksdesign. Take a look at the work we do.

AD by FUSION

Jobs

Hicksdesign doesn't have any vacancies, but these fine folk do:

    Via Authentic Jobs Come in, we're hiring!

    playlist

    See more on last.fm

    Contact

    Hicksdesign

    73a High Street

    Witney

    Oxfordshire, UK

    OX28 6JA

    +44 (0)7917 391 536

    Download vCard

    Engine Room:

    Hicksdesign is powered by Textpattern and hosted by the lovely boffins at Engine Hosting

    Engine Hosting