The site is built to clear standards, and designed specifically, not to be responsive, but to render beautifully at any size.

The entire portfolio system is built on vimeo‘s API, so video updates and seamless and simple and they maintain complete control over their video content.

The backend of wordpress, which houses the text content, has also been customised deeply to allow simple, and semantic updates to ‘Add a Director’ and connect to a vimeo album.

The site aims to be driven through a travelogue, connecting the experience of visiting Kerala with the packages they create. It’s more than transport and hotels, it’s learning about the cities you’ll visit, the people you’ll meet and the experiences you’ll look forward to.

The design was driven to help the colours of the photographs stand strong, interconnect the different aspects of the site, and make reading long articles easy and pleasurable – all the while leading to an incredibly simple final form that initiates the booking process.

In addition to the website, we also handled the illustration for Joshua’s Heritage logo. Joshua’s is a sister property, also located in Kerala.

So far, I’ve stood on the side of: designers should know about the tech they are using to know its potential and use it well. But one idea pushed me straight over the edge – designing in the browser.

Generally, the process for quite a while has been, a designer opens photoshop and puts together a beautiful image of a website. This is shown to a client for approvals and then the developer gets to work. He curses the designer for using rounded corners and drop shadows that cross box lines and the final product is a close approximation of what the designer intended. This is why print designers can’t do websites. They have no clue what a developer has to do to get their design to work on different browsers.

So for the latest version of our site, I decided to skip the Photoshop step entirely and go straight to the browser. There are quite a few advocates of this method, but I had never tried it for myself. The other big advantage I had, was that the content already existed. It was laid out in WordPress, so when I wrote my HTML, it wasn’t with damned Lorem Ipsum, it was real. And this make a really big difference in choosing fonts and sizes, especially when aiming for a responsive site. We embrace reflow and have to work in a flexible medium to truly understand what different users are going to see. It isn’t a process of getting the site to look the same on all systems and browsers. But getting it to look right on all browsers.

If you want to work in the web, this should be your introductory ritual of sorts. It breaks all your expectation and frees you from the constraints you put on yourself, your obsessive control over what the design should look like.

Welcome to the internet.

Bacardi Breezer drives their campaigns with music and to spread the excitement, they needed something that broke boundaries and did something entirely unexpected. OML, who handles their marketing devised an online game that allowed players to control a dancer at a party. We worked with Babble Fish Productions for sets and shooting and programmed the game in AS3.

It’s seems like a term created solely to allow some quote-padding, because if you’re not building for your user, who are you building for at all? I have the same problem with ‘design thinking’, after all, all thinking primarily involves design. If not, it is simply recollection. But this post isn’t merely a rant on the semantics of our industry.

What is a user then…

When we build websites, this seems to simply be the people who finally use the site. We choose the percentage of them we’d like to target clearly, and we tailor the site to benefit them as much as possible. This is important. And many people have written many articles on the subject. I’d like to broaden this definition, and take it a step outside just the final product.

A user is the next person who will use what you’ve made

I’ve started using a great service to turn my designs into HTML before we connect a CMS to it and touch up any CSS work. To me as a creator of a PSD then, they are my users – they need to be able to understand my intent for design and turn that into a functioning site. That file then needs to be understandable enough for a programmer to insert back-end hooks and flexible enough to accept content it was designed for. And that final code then needs to be usable enough by me, to edit and poke and prod and get everything working just right. Each of these stages, has a user. And that user is integral to the project. I’ve been on all three sides of this circle and more often than not problems arise simply from something getting lost in translation – it wasn’t designed for its next step, its next user.

Even further out

If I’ve made sense thus far, then we can extend this beyond the actual project as well. Your first email to a potential client should be usable: they should know why it’s there, and what their ideal next step is. The quote, and subsequently the contract can both be usable and allow simple understandings between all parties. Your office can be usable: do people know where to wait, whom to speak to when they walk in, are they given enough reason to anticipate the next step? Everything we put into ‘user-centred design’ can be applied to everything else as well if you broaden your definition of a user.

It could make the world far more pleasurable to interact with.

Responsive Web

Rather than have a completely separate mobile website, we’ve used media queries to provide a website that adapts to whatever screen size it is viewed on. Smoothly resize the site from a large desktop through laptops, tablets, all the way down to a smart phone. The website adapts to the new screen size and provides comfortable viewing on all devices.

WordPress

We’ve used WordPress as the CMS feeding all content to the website. It is extendible and powerful and we cannot sing its praises enough.

Manek D’Silva, rhythm guitarist and incredible illustrator, painted the cover and each page of the inlay – get a hold of the album to truly get a look at all the painterly goodness.

Photography
Clyde D’Mello

Artwork
Manek D’Silva

Design
Ashim D’Silva

Official Music Video

As a really big first, we decided to take a step into actually producing a music video for Slain. Doing it all internally gave us a lot of freedom to try tonnes of things and learn a tonne about producing video. We did two quick home-brew style videos before this which we loved, so this was a giant leap forward in production value which paid off well.

From IndianRockMP3:

Your Majesty is the second track off Slain’s 2010 release ‘Here and beyond’. The band’s first music video is a simple and straight forward one. There is no concept as such, it’s more or less a rhythmic montage centred around the band. Simple yet very classy camera techniques mixed with tonal edits make it visually likeable. Your Majesty is definitely one of the better videos to release this year in terms of production.

Video Credits:

Live Music Video

At the album launch ‘Beyond Live’, we also shot a music video for an old favourite: More Than Conquerors.

Cameras
Kiran Nayak
Rohan Herbert
Ashim D’Silva

Editing
Ashim D’Silva

QR Codes are small images with text data embedded. Your camera phone can quickly read them and show a URL, vCard, or any other data really. They’re big in Japan where they started, but are starting to spread; often also called 2D bar codes.

After doing a fair amount of searching, I couldn’t find a one-click solution to very simply displaying a QR code for the page I’m currently on. So I wrote a quick version using a Google’s really handy online chart service that generates them and tied it up to display over your current content. It’s a bookmarklet, so it should work on any browser you have – yes, you can even use it on your phone to transfer to another phone!

QR to Here

Just drag that link into your bookmark bar and click it when you’re on the page you want. A QR Code will pop up over the content that you can instantly read with your phone.

All the magic of finding
that perfect set of colours
back in your hands.

Zero Interface

There’s nothing between you and the colour. Move your finger across the screen and feel out your hue.

Hex values or Colour Names

Working on a computer? See HEX values that will easily transfer over to your favourite editing program. Working in the real world? Get names that are easy to remember.

Get the app

Go to the URL on your phone or use the QR code to lead you straight there. If you’re on an iPhone, you can easily add the app to your homescreen to jump back in later.

http://therandomlines.com/flush