Stoked I got to catch up with Roby Fitzhenry, the Creative Director behind the build of the awesome Always Creative website. He discusses in detail the cross browser work done and why they decided on One Page only…

Hi Roby! To start, can you please tell our One Page addicts where Always Creative is based and what your role is?

Always Creative is a creative agency based in the lovely, although sometimes sweltering, Houston, TX. My role at the company is Creative Director. We’re a small team of 4 with distinct, but slightly overlapping roles. Outside of being lead designer and working closely with the team on most projects, I handle a lot of the networking and sales responsibilities.

Can you give us an overview of your work environment and the setup you work with?

We actually just recently moved into a 1,200 square ft. home that was built around the 1950’s. Before that, we were in a much more open environment, which made it hard to have client or private meetings without disturbing the team. We all work on MacBook Pro’s and 27-inch Apple LED monitors. The laptops are essential for us because we all have work stations set up at home if there are no meetings to attend at the office. In our profession, a change of environment can make a big difference, so we like to have the option to work from home on occasion. We’re also all huge fans of Behance’s Dot Grid Journal and Dot Grid Book.

Big images, full screen slide transitions, parallax scrolling and a slick minimalistic design… within seconds I could tell the site would be in the “Most Loved” category. How long did it take to build?

The rebrand/reworking of the site actually came together fairly quickly. With an agency like ours, it’s always hard to make time to redo your own website, but once we decided to, we gave it our full attention (like we would for a client project). We had been dabbling in responsive web design for 6 months or so and decided that if we were going to offer that service to our clients, we should prove that we’re capable by doing it for ourselves. All-in-all, it took around 4 1/2 months to do the branding, website design, copywriting, figure out the responsive breaks, develop it, test it, prepare the portfolio pieces, and launch. This was all while we were trying to stay on top of client work, as well as building our own responsive web app for Houston called http://houstonhasheart.com.

So why One Page?

We love the ease of One Page websites. If you look through some of our work, you can see that we have a knack for simplifying websites. We get to the core of what makes a company, product, or service unique and then we elaborate on that. The ultimate simplicity in website design is the One Page approach. There’s some research out there that shows people are more likely to scroll than commit to a click, so why not let them scroll through all of your content easily? We also wanted to go the opposite route of our previous site and simplify the story we’re telling, even if doing so makes it a bit ambiguous.

The real x-factor for me is how there is so much goodness in the site and you didn’t lose the love in the contact form (I often see this in submissions). The way the submit button only lights up/activates once all fields are filled in is pure love. Any cross browser issues you guys dealt with in the build?

We’re glad you noticed :) We put a lot of time into some of the finer details, things most people won’t notice (favicon, apple touch icons for iPhone/iPad bookmarks, the form submit button you referenced, etc.). We feel like these little touches really help to seal the deal.

The slider in the Process section needed some work in IE8 and below. The site is responsive for IE8 (using respond.js (https://github.com/scottjehl/Respond) since CSS3 min/max-width media queries are not supported for IE8 and below). The site is not responsive for IE7 and below, but some CSS was added to the IE7 stylesheet for the site to be styled to fit a standard desktop view.

Other than needing to adjust or add some CSS rules to tweak and fix some elements (e.g. floats in the Portfolio section, elements within the content blocks of the Process section, etc.), there were no other notable cross-browser challenges.

The bigger challenge was testing and optimizing for performance across different mobile devices due to the desire for our site to be responsive and device agnostic. The Portfolio section, specifically the window that slides and contains another slider for the details of each portfolio piece was probably the largest challenge. The iScroll 4 javascript plugin was used to provide native-like scrolling behavior (as well as momentum, bounce, etc.) for the Portfolio slider window since it has a fixed position. There were some performance obstacles to overcome regarding the smoothness of the portfolio window sliding in and out on mobile devices (solved by hiding the visibility of the window’s slider contents until the window finishes sliding). This part was heavily tweaked multiple times to have it optimally perform on mobile devices.

Cheers for giving our readers some insight on your work! Where can people follow your teams work in the future?

Thank you so much for featuring us on your site, we’re huge fans of OnePageLove. To keep current with our firm, keep an eye on https://twitter.com/alwayscreative and http://dribbble.com/robyfitzhenry. You can also try the local pubs, we’re known to frequent them.

---

Man, absolutely loving these interviews! Also follow Roby on twitter here. One Page sites are here to stay boys and girls:)

Much love,
Rob

Twitter: @robhope
Email: [email protected]