Bootstrapping and Masoning #IAMSocial

Posted on December 3rd, 2014
Tags: , , , ,

About two years ago I decided to dig into Bootstrap. It took me some efforts at the beginning but with time and practice I got used to its column grid system standards, its powerful UI components and its LESS based structure.

Always willing to try out new techniques, I was excited when our professor introduced Foundation and required us to use it for our final project. This seemed to be a great opportunity to learn another grid framework and a new css compiler: SASS.

In my last post, I mainly talked about my work on the WordPress back-end side of #IAMSocial. But I promised a post about my front-end’s ideas. Well, here it is, and with it I announce that I am breaking the rule: I will not use Foundation but Bootstrap instead.

I hope I won’t get an F for being such a rebel, but the more I was using Foundation, the more I found it lacks of some of the cool UI features Bootstraps offers. One thing that I liked though, is the icon bar. So don’t take me wrong: I am not saying that Bootstrap is better and I think I’ll give Foundation a second chance in some future projects.

That said, note that I sometimes do listen to my professor’s advice. Remember this design?

#IAMSocial Homepage

Well, following its recommendation, I got rid of the three featured content areas and replaced them by a “Masonry layout”. I found this approach to be more “social:” Pinterest and Google+, for example, use this type of vertical layout.


I hope this will make up for my resistance in using Foundation… I’ll let you know my final grade.