In collaboration with Alaska’s dev and QA teams, we helped the company launch a new mobile site (m.alaskaair.com) a few weeks ago (you may have already seen some of the key features and updates). As a self-proclaimed mobile geek, I wanted to share a few additional features to bring out your inner techy.
1. Fewer images + CSS gradients = faster load times
Let’s face it: travelers care about a speedy, easy-to-use experience when it comes to mobile sites. With this in mind, we determined it was important to use very few images. All of the buttons are CSS gradients, which makes them easy to tap and scales perfectly. This all helps with faster load times.
2. Responsive design
When we set out to create the site, we wanted it to work across a number of mobile devices. To make that happen, we went with a responsive design. The HTML5 site will adapt across a variety of screens up to 800 px wide.
Head over to m.alaskaair.com and pull your browser window in and out (in case you aren’t familiar with responsive design).
3. Snazzy seat selection
One particularly snazzy feature is the seat selection. Technically, they are stylized radio buttons, which allows for graceful degradation for older devices. Customers can change seats for a party of up to 7 travelers at one time. As you scroll, a portion of the screen remains locked to the top of the screen, so you know the row letter for each seat. You can also view the location of exit rows, wings, galleys, and restrooms.
4. Backend
Capturing each flight and allowing users to pull up boarding passes for up to 7 people, even in airports without Wi-Fi, was a challenge. We created offline storage for the boarding passes, which is essentially one big cached page that prompts users to bookmark their pass. All flights are tagged as events so in the future they can be pulled out and added to calendars or other apps.
5. Notice the clouds?
As a designer, we take pride in the small details. To the not-so-meticulous designer eye, you may have glanced over the cloud image that scales in and out. We used three different layers so the image could gracefully degrade. Just a fun element worth pointing out.
Between Alaska Airlines’ mobile apps and sleek new mobile site, the busy traveler has a number of convenient options to choose from when catching their next flight.
