It's been quiet... too quiet Tuesday February 19, 2008, 15 comments

And now you know why!

I proudly present the latest iteration of A Rain of Frogs.

This design has been percolating in my head for quite some time, but something has always come up to prevent me from gaining any headway on the project.

It started a while ago when I was toying around with ideas for logos. I have always liked the serif wordmark I used on this site, especially coupled with the image of the falling frog, but it just wasn’t… indicative. Not iconic enough perhaps. The idea of a rain of frogs is hard enough to explain to people, let alone to leave imprinted in someone’s memory.

And so, after much experimentation, I finally came up with the frog and his umbrella. This seemed to capture the feeling I was trying for, and so it became the centerpiece of a whole new direction for this site.

It was important to me to retain the ‘orangeness’ of the site as well. The site has always had a strong orange component to it, and I didn’t want to lose this. But I also wanted to branch out, create something a bit more distinctive than the bold but eventually unremarkable orange bar the site has featured for the last year and a bit. The bold grey header bar, to me, actually enhances the orange of the site.

I wanted more space for content, but didn’t want to pack the site with text. I’ve been exploring photography and sketching again, and wanted to make a place that encouraged me to post my explorations. My girlfriend had also made the observation that I didn’t include much artwork in my design. I pondered this for a while and decided she was right.

Typographically, the old site was a step forward. It featured some interesting stylistic details, the most notable being hanging quotes. But the type was small, and with the purchase of my Macbook and its very high pixel density, the type became uncomfortable to read. I freely admit this might be a function of my aging eyeballs. The new site features much larger and much more readable Helvetica Neue (or Arial, if you’re not so lucky as Mac users), in a slightly easier-on-the-eyes dark grey. Contrast is good, but too much can be a bad thing.

Then there’s the actual code. It’s more compliant, more semantic, and simply all-round better. I accomplished more with less code, and that code is prettier than the old version. I also did something I had meant to a long time ago, and took advantage of elastic design to let the layout scale with type size. This was important to me, and I am glad I have done it.

There are more changes ahead for A Rain of Frogs, not least of which is tuning the site to better handle Internet Explorer. I make no claims about the site’s layout in that worst of browsers, but I am going to spend some time working on it. Stay tuned for details on this and many other upcoming changes.

I am proud of this redesign. I hope it is as good for you as it is for me. Please take a moment to let me know what you think.


Comments

spook Tuesday February 19, 2008


i like it.

jeff Tuesday February 19, 2008


Like the new design Adrian. Keep up the good work.

Jonathan E Wednesday February 20, 2008


Nice job man! I really like the update and the new logo. I am sad to see my site gone from your list of elsewheres though :(

Adrian Wednesday February 20, 2008


It’s not gone forever Jon! That’s one of the things I am working on, a randomization of the links.

Noel Hurtley Wednesday February 20, 2008


It’s really fantastic. The only thing I would suggest is increasing the line-height and possibly vertically centering the content in the footer.

Nice work Adrian!

Adrian Thursday February 21, 2008


Thanks Noel!

The placement in the footer was deliberate, with a future site enhancement to come.

As for the line-height, it’s already pretty loose, I think adding any more would begin to impact the scanability of the text.

But thank you nonetheless for the suggestions and the compliments.

I took a look at your site. Lovely photography! You should consider giving your readers an opportunity to comment on your site!

eran Friday February 22, 2008


i love this. when i first saw the new logo, i knew you were onto something, but the new design.. it really showcases the logo well. bravo. and ya, its still orange enough.. just the perfect amount. nice work like usual. cheers.

brandy Saturday February 23, 2008


I love it! I think I might even be starting to love orange too.

Nice work A.

Adrian Saturday February 23, 2008


Thanks B!

I love it too. Much better platform for accomplishing the things I am hoping to accomplish with the site.

And that is, after all, what design is about.

Thomas Tuesday February 26, 2008


Adrian,
I’m very impressed by the color, layout, and typography. Excellent grid and really quality typography my friend!
Would you be willing to share how you did any of your Textpattern schematics? Did you create a lot of your own forms for each page? Did you use any plugins – or write any of your own? I’m very interested in how you created the gallery.
Anyway, would love to chat about this sometime.

Daniel Black Tuesday February 26, 2008


Holy crack smokers. This is quite a refresher. I think you sell your old design short, but this is very nice, too.

Ugh. “Nice.” Let’s try “nuanced,” “quietly intimate,” “warm and confident.” Those are a bit better than “nice.”

Daniel Black Wednesday February 27, 2008


I’m a little curious about the link labels. There is one in the link list that I took to mean, “This link takes you away from here,” and so supposed the more basic arrow kept me on your domain. I’m not at all being critical; I was just wondering about your consideration of these elements, for my own education.

Adrian Thursday February 28, 2008


Daniel, thank you for your very generous praise!

The link labels are indeed as you assumed. I gave them a bit of thought, but they still might get refined more. We’ll see. Always in flux, the future is.

Thomas, I used an insane amount of custom forms. The only plugin I use is one that lets me run slimstat (or Mint, if that’s your preference).

I’ll do a more detailed writeup of the textpattern side of things. I feel I am at the point now where I can consider myself something of an expert.

Suffice it to say that textpattern is my primary choice of CMS.

Daniel Black Thursday February 28, 2008


Well, now, a salvo across the bow. I might someday endeavor to learn the differences between Wordpress and Textpattern.

Adrian Friday February 29, 2008


Wordpress is a fantastic tool – I just always found it ponderous to go in and manually edit templates to get the effects I want.

Textpattern uses something called a form, not to be confused with a web form one fills out. These forms basically allow you to create, use and reuse little bits of code. They can be PHP, HTML, or consist of textpattern tags, of which there are many.

Everything is built through the browser, which sounds a bit weird when I write it, but it works out so easily.

The real advantage of this, to me, is that the entire site, including its look, is stored in a database, instead of being php templates stored on the server. The only things that aren’t stored in the database are images and files.

You should give it a try Daniel. I’d be more than happy to help you with any questions that might arise.

Commenting has ended for this post, but I'd still love to hear from you.

The website of Adrian Lebar

Hey! I don't really post here much any more, but I have been contributing to Temna Zvezda. Why not head over there and check it out?

A Rain of Frogs was written, designed and built by Adrian Lebar, a twenty-five(!) year veteran of web design and development. He is currently managing web and mobile development teams at Canada’s largest and most beloved classifieds site, Kijiji!

He is a father, sailor, snowboarder, skier, cyclist, writer, artist, graphic designer, classically trained musician and afraid of heights.

Adrian is not currently available for freelance and contract work. Learn more.

Provoking a response is different from saying something significant.”
- Unknown

Twitter