This showcase is different from the others you usually see on Drupal showcase. Since the project is to create a generic theme that provide a concept design, high flexibility and easy customization ability to users; not for a specific business organization. We strive for a general method of building a site based on the predefined concept.
Inspired by Pinterest, project’s objective is building a theme that has grid layout and responsive design used for heavy-content sites. The theme has to meet high demands of site performance and multiple content type displaying. And last but not least, it must be a clean & clear design.
First of all, most of other CMSs (specifically Wordpress & Joomla) already have various theme versions of Pinterest concept. While in Drupal due to limited number of professional theme providers, this project can be considered as one of those first initiatives bringing Pinterest layout to Drupal.
And how Drupal helps us in the project development? Absolutely it does, and does so well. Thanks to Drupal high flexibility, we are confident that our outcome would be a multi-purposed theme that users can tune in and customize as they like.
Furthermore, vast amount of Drupal third party modules make it easier for us and users to implement our ideas. For us that is a theme serving multi purpose with capability of display heavy content at optimized speed. For users it could be a scalable site, maybe some small blog to start with and then a news site when number of daily visitors reaches thousands.
The objective of the project is to create a theme with creative grid layout, optimized speed performance, good usability, mobile-ready. Moreover, apart from our existing themes, this one has to be different from the rest so we can maintain the diversity and fulfill our collection.
Although the project team is small, we use Scrum to take advantage of its fast development cycle and strong adaptability to change.
In order to satisfy the requirements, we came up with a set of features that are necessary to implement:
- Infinite scroll: improve usability, lessen interruption from clicking “Next page”
- Lazy loading: optimize performance, also support for infinite scroll
- Smart grid layout: depends on the defined content (each has different display dimension), providing best layout possible to keep the appearance well-organized
- Various content appearance: size, color, badge, content types...
- Responsive design: a must in nowadays web design since the number of users using mobile & tablets has increased rapidly
- Social media feed: of course it’s essential
- User interaction: comment, post articles... are common features
There was a number of challenges in front of us to fulfill goals of the project. One of them was to create an innovative front page layout like Pinterest with full of customization for each node teaser (background, size, badge). Moreover, implementing infinite scroll was another obstacle. This feature would be used in different pages such as homepage and other categories pages. Therefore, it must be implemented in a reusable approach. Finally, pop-up content and showcase with different images were challenging as well.
Sites made with TB Wall
Below are some of our customers' sites made with TB Wall:
As usual, our project team for creating a theme is lean, it consists of 1 css, 1 developer, 1 QA/QC (she was in charge of both job), 1 designer.
Time line: 6 weeks (Please find the diagram below)