Monday, October 19, 2009 css grid framework, mockups and failing fast

Finally I've gotten around to making use of one of these css grid frameworks. Based on some cursory research I decided to use the framework.

Why I like

No new knowledge - This framework builds on my existing css knowledge, it doesn't require me to install ruby/java and compile my css or any weirdness like that

Easy to learn - The principles are very easy to learn, this is important and usually means there will be good adoption of the tool.

Fast to get started - Being able to quickly test out new ideas is a big win, I believe in the concept of "fail fast". Anything that speeds up your "idea-test-implement cycle" is potentially valuable.

Documentation and Examples - Even though it's dead simple, examples and tutorials are always helpful, thankfully, these weren't hard to find. It seems has gained good momentum.

Day 1 with the framework
So what have I done so far? I've been pretty productive with this new framework. I decided to start with my own personal site.

I'm not fully satisfied with the final product, but as a proof of concept, I was able to get the prototype done very quickly, so I consider this to be a good start.

Most of my time was spent iterating over my logo and getting the mockup done in inkscape.

I used a grid layout generator to create a 16 column grid which I used as the starting point for laying out my design in css/html. The relevant parts of my mockup were exported from inkscape as PNGs in Plone

Using Plone's newly popularized xdv approach to theming, I was able to bring my html almost wholesale into Plone and the result are below. Note that the portlets are still unstyled but this is a good start.


Unknown said...

Also check out the grid system shipping with Plone 4, available separately here:

andrewabogado said...

@pigeonflght Our team successfully managed to use 960 GS on one of our Plone projects. It wasn't an ideal implementation but it still works and serve it's purpose.

@Alexander Limi I'm glad to know about Deco. I'll be checking that out. I am looking forward on the new Grid System for Plone 4 (really excited). Kudos to the Plone team.

Unknown said...

I'm getting into now and have used on projects.... will need to update the blog.

Sign up for my upcoming Plone 5 Book & Video tutorials

plone 5 for newbies book and videos