Drupal: Revamped user experince for Volacci.com

For the span of the last year, I have been working closely with Volacci.com, implementing some of their suggestions, and making their Drupal 7 web site more friendly and functional. Here are some changes that I implemented on Volacci.com web site.

1. Drupal Responsive Menu.

This change was the first of the series. Drupal did not have any decent responsive menus back then (since July 2013, there's a Responsive Menus project). The solution was akin to what I had previously built for Dwell.com, with some changes and adjustments. As the work progressed, the menu was integrated into the top panel for the narrow layouts.

Responsive menu
Responsive menu

2. Drupal User Panel.

Drupal user panel is but a small module, the incorporates the user menu in a drop down. A small but pleasant enhancement that plays a big role for a client, who has to have an instant access to some of his functionality. As the work progressed, it was decided to incorporate the user panel visually with the responsive menu for the narrower screens.

User panel
User panel

3. Drupal Blog Grid Layout.

Drupal Blog grid layout was one of the challenging things. We discussed the design and implementation at length, and tried different approaches before we settled with the current one. The challenges were adjusting to narrower and wider resolutions, and keeping the height constant. JQuery and Infinite Scroll were used.

Blog grid responsive layout
Blog grid responsive layout

4. Blog Post Data Section.

After reviewing some possible ways to format the user and meta data, we decided to take the Lullabot.com blog section as an example, and adjust it to fit our needs. I have implemented the solution, which made the Volacci blog posts look fresh and professional, and opened the path to posting guest blog posts there as well.

Blog post data section
Blog post data section

5. Drupal User Profile.

User profile was built in the same manner as the blog metadata section, with the user blog posts presented in the right sidebar. The user name is drawn in a smart way from the user name profile settings. In this way, the first and second names are displayed, rather than the user name, if present.

User profile
User profile

6. Drupal 7 and Janrain (RPX) integration.

Drupal registration process can be a "pita", and blocking out spammers requires even more effort. The goal had been to allow users to sign in painlessly, and minimize the amount of spammers. Social network registration appears to be the best way to do that. From my experience, there is no one and for all solution here, with Janrain being the one solution that works more than it doesn’t. A custom patch had to be applied to make Janrain work the way we wanted it to.

7. Drupal and Secure Download Link.

There has been discussed a solution, that would allow easy registration and access for users to access the restricted materials. Now, there is a Volacci Automatr form that needs to be filled to gain access to a specific marketing resource. The idea is to unify this experience, so that users would not need to fill a form multiple times. This will be achieved with a secure field and Janrain (RPX) registration. A download link will be showing for registered users, and a Janrain widget - for the anonymous ones.

Secure Download Link
Secure Download Link