Category: Mobile

This category features articles on best and emerging practices for responsive website design, Web apps and native apps. While the mobile Web is still in it’s infancy, we can learn from the experiences of professionals who are working on mobile every day. Curated by Derek Allard. Subscribe to the RSS-Feed.

Popular tags in this category:

Responsive Web Design Apps Techniques iOS User Experience

Off The Beaten Canvas: Exploring The Potential Of The Off-Canvas Pattern

The off-canvas flyout menu has taken over as the primary navigation pattern for mobile layouts — even some desktop layouts have jumped on board. And for good reason: An off-canvas menu is a great way to maintain context while giving the user a lot of additional information.

Off The Beaten Canvas: Exploring The Potential Of The Off-Canvas Pattern

In this article, we’ll talk about why off-canvas has become so successful as a navigation pattern and show its potential to be so much more. From filters on product list pages to shopping carts to lists of recently viewed articles, the potential of this pattern is bound only by our drive to pioneer. It’s time that we explore just how far off canvas we can go.

Read more...

Responsive Design Frameworks: Just Because You Can, Should You?

Responsive design is about building a website with a grid-based layout, images that resize and media queries, as described by Ethan Marcotte. After Marcotte defined the technique, responsive design frameworks began to emerge that incorporated these principles.

Responsive Design Frameworks: Just Because You Can, Should You?

Mostly based on CSS and JavaScript, many of these frameworks are open-source, free to download and quickly customizable. Some of the most popular today are Bootstrap and Foundation, which we’ll focus on in this article. As responsive design frameworks became popular, a big debate emerged: Why would a professional designer use a responsive design framework?

Read more...

Four Ways To Build A Mobile Application, Part 3: PhoneGap

This is the third installment in a series covering four ways to develop a mobile application. In previous articles, we examined how to build a native iOS and native Android tip calculator. In this article, we’ll create a multi-platform solution using PhoneGap.

Four Ways To Build A Mobile Application, Part 3: PhoneGap

Adobe’s PhoneGap platform enables a developer to create an app that runs on a variety of mobile devices. The developer accomplishes this largely by writing the user interface portion of their application with Web technologies such as HTML, CSS and JavaScript.

Read more...

Applying Transformations To Responsive Web Design

To most Web developers, it sounds controversial until you hear the punchline: Last summer, the developers in charge of Google’s Chrome browser floated a proposal that went virtually unnoticed by the technology press, which was to remove support for an established W3C standard that every other browser vendor still supports.

Applying XSL Transformations For Responsive Web Design

The standard in question? Extensible Stylesheet Language Transformations, otherwise known as XSLT. In reaction to this news, most Web developers would likely shrug and say “So what?” That’s unfortunate. Transformations are a simple yet powerful technique for separating content and presentation in Web applications.

Read more...

One Solution To Responsive Images

Responsive images have been, and are, one of the hardest problems in responsive Web design right now. Until browser vendors have a native solution, we have to think on the fly and come up with our own solutions. “Retina” images are especially a challenge because if you have sized your layout with ems or percentages (as you should!), then you cannot be sure of the exact pixel dimensions of each image being displayed.

One Solution To Responsive Images

In this article, we’ll look at one solution to the problem that we implemented on our portfolio website at Etch, where you can see an early working version in the wild.

Read more...

How To Use Data And Research To Build A Better Mobile Web

The value you bring to any project as a designer or user experience professional isn’t only your ability to execute a series of tasks. Good clients will recognize and appreciate the guidance, recommendations and opinions that come with your experience.

How To Use Data And Research To Build A Better Mobile Web

It’s up to you to be forthcoming and to position yourself as a valuable thinker from the start. It’s also up to you to base your recommendations on more than subjective opinion. This is especially true in the rapidly evolving world of mobile, where clients typically require as much education as they do execution.

Read more...

Four Ways To Build A Mobile Application, Part 2: Native Android

This article is the second in a series of four articles covering four ways to develop mobile applications. The last article covered how to accomplish this using native iOS development tools. In this article, we’ll look at how to build the same sort of application using native Android tools.

Four Ways To Build A Mobile Application, Part 2: Native Android

We’ve been building a simple tip calculator. As with the iOS application, this one contains two screens: a main view and a settings view. The settings view persists the default tip percentage to local storage using Android’s SDK support.

Read more...

↑ Back to top