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. .
Popular tags in this category:
Responsive Web Design Apps Techniques iOS User Experience
The O’Neill Clothing store had a nearly 600% revenue increase from going responsive, and Skinny Ties saw a 377.6% increase in revenue for iPhones after going responsive as well. Even Think Tank Photo’s transactions on smartphones and tablets increased by more than 96%... go figure!
In this article, we’ll walk through all of the vital steps when planning a highly converting mobile e-commerce website. The most important questions you need to ask are:
- Who are we building this mobile website for?
- How will we measure conversion success?
- What design factors affect mobile e-commerce conversion rates?
- What is the ideal product page?
Let's get started. Read more...
There’s no need to bust out a physics textbook to make your iOS 7 app’s views animate like real-world objects. With iOS 7’s new Dynamics API, views can be influenced by gravity, attached to each other with springs, and bounced up against boundaries and each other.
Physics engines are no stranger to game designers. Whether it’s the perfect gravity-induced parabolas of Angry Birds or the swinging candy in Cut the Rope, we’re used to objects in games feeling real. To get this effect, game designers don’t write code to set the position of each object manually. Instead, they use a physics engine that treats the elements as bodies in a simulation and that uses Newton’s laws of motion to calculate how they move over time. Read more...
This article is the last in a series of articles covering four ways to develop a mobile application. In previous articles, we covered how to build a tip calculator in native iOS, native Android and PhoneGap. In this article, we’ll look at another cross-platform development tool, Appcelerator Titanium.
PhoneGap enabled us to build a tip calculator app quickly and have it run on both the Android and iOS platforms. In doing so, we were left with a user interface (UI) that, while quite usable, did not offer quite the same experience as that of a truly native application. Our PhoneGap solution leveraged a Web view and rendered the UI with HTML5 and CSS3. Read more...
Mobile first! Responsive design! You’ve heard all of the buzzwords and catchphrases. Countless helpful and not-so-helpful articles proclaim the rise of mobile, but what practical steps can you take to make your brand more approachable for mobile users?
When arguing a case to make a website mobile-friendly, abundant evidence exists to present to the business owner, such as the Pew Research study that shows that 56% of US adults carry around a smartphone. However, while general statistics are useful for demonstrating the value of designing with mobile in mind, they don’t provide the guidance necessary to understand precisely how users will interact with a particular brand on their phone. Read more...
A few HTML elements don’t play nice with responsive layouts. One of these is the good ol'
iframe, which you may need to use when embedding content from external sources such as YouTube. In this article, we’ll show you how to make embedded content responsive using CSS, so that content such as video and calendars resize with the browser’s viewport.
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.
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 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.