Category: Mobile Development

Let’s face it. If it is not a game or a map, most apps are lists – lists from which users make selections. Your job as an App designer/developer is to make the layout appealing and to make UI easy. Designing an app for mobile just means you have less real estate to use to accomplish that great layout and user interface.

Here are some Mobile App Design tips and tricks that will let you get the most out of that small screen. Even though there are many similarities, keep in mind that Mobile App design is not like web design.

1. Don’t Abandon the Basics of Design

Whether an app is designed for full screen or a mobile device, there are certain design principles that you must use. Here is a quick review.

1. Know your audience: Design will differ based upon who will be using your app. When you know your users you can design for their goals, not yours.
   For instance, a Lego App will look very different from that of Eleven James, a company that rents Rolex watches to its customers:
2. Usability: Look at the two apps above. The user will know exactly what to do – tap on a card to see the movie or tap on a watch for further description. And, if the app comes with a price, such as the Lego one, usability is even more critical.
3. No Learning Curve: Your App interface should be intuitive. Users should know how to use your interface almost instinctively. If you use familiar patterns, this will happen.
4. Feedback is critical: Let users know when a task is completed. Because of limited space, you don’t have to tell them with text. Use something as simple as a sound or a bit more complex like a modal window.
5. Consistency of signifiers: If the green button signifies a “go”, then every “go” button is green. If a red button is a “no thanks” then all of them should be red.
6. Response Time: You don’t need to be reminded that everything in your App must respond and load within 1-2 seconds.

2. Mapping Out the Flow – Get Out the Paper and Pencil

Sometimes it is best, faster and easier to do the initial prototype on paper first. Even though, there many excellent prototype tools, such as: Framer and Marvel.

You want to get an understanding of each page of your app, what the layout will be, and how one will flow to the next. Sometimes a written flow chart works too – it will help you develop the hierarchy. And be certain, in your sketching, to place any content you intend to have. Creating content for mobile apps requires real frugality, so make these decisions early on.

3. Use Familiar Patterns

While you certainly want to be creative, you also want the user to feel familiar with your app right away. This is done by using familiar patterns of such things as button or menu placement. For example, app users will be very familiar with a menu placed at the bottom of the screen. Buttons placed at the bottom of the screen are much easier to activate than buttons at the top. Remember – it is about ease of use. Take a look at the image below:

In addition to the tool bar at the bottom, look at the size of the buttons to access each page. They are made for people with fat thumbs.

You will also want to take a look at other common patterns such as slide-out navigation or newer one-page designs where users just swipe instead of push button. These are generally faster, and users are very familiar with them now.

Here is an example of a slide-out navigation by Lyft, an app that matches riders with local drivers.

Notice as well the map used is another familiar design pattern. While you should not literally copy the design patterns of someone else, doing some research will give you some solid ideas to which you can then add your own creativity.

In general, there are two types of design patterns you need to master and use if you want to design for mobile – gestures and animation.

Gestures: Remember that all touch devices will use certain finger movements, and these are now pretty much second nature to mobile app users. Thus swiping, tapping, zooming and pinching are all gestures in which users are comfortable with. Here is a visual to illustrate the different gestures on mobile Apps.

Animation: Sliding frames can come in an out as directed by the user, usually by swiping.

4. Be Careful About the Text

Be certain that the text used in your App is clear, but you probably already understand this. Here are a couple of tips:

1. Phrase labels with positive words.
2. Important words in phrases must come first.
3. Make certain that text is of a uniform style on all screens.

5. Fonts and Readability

Again, you are designing for the user not yourself. What you might love may not be practical and pleasing to others. There are few considerations here. Ask yourself the following questions:

1. Can I use it easily on mobile?
2. Is it legible?
3. Are there a variety of font weights?

Typography is hard to master, so the best thing is to pick one that is common and with which the user is familiar. There is very little difference between Helvetica, Arial, or Robots, so these would be obviously good choices. Reserve fancy fonts for logos.

Remember that readability is tricky on small devices. Focus on contrast, font size and line-height.

6. Flat Design vs. Variations

Flat design is quite trendy nowadays. Even Microsoft has flattened out its signature logo design. However, some variations have crept back in, such as shadows and gradients, so get a little creative as long as you use such things moderately and they are pleasing to the eye. Here is the difference between Google Chrome gradient and flat logo design:

Some people prefer the gradient design to the flat, but for design, consistency is more important. If you decide on flat designs, stick with them, perhaps adding shadows or a background color gradient for more interest.

7. Clutter – You Don’t Need It

Your user is in a hurry. There has been a “rule” of sorts that an app user should be able to find everything necessary with three taps or swipes – one to open the app, and two to find what s/he wants. While this is no longer considered valid, it is a good start point when you are determining how many screens you will design. Go back to your flow map and see if there is anything you can eliminate. Anything you can do to eliminate the amount of work for a user, the better your app will be received and better user experience

8. User Testing – Every Element – No Exceptions

User test virtually everything. For some of the testing, you can use remote testing with any number of testing tools and services out there. For behavioral issues, such as gestures, sliding, buttons, and placement of menus, etc., it is a good idea to have 5-6 different people test these in your presence so that you can see how the device is held and ensure that gestures are not awkward.

Your online web presence for desktop users is probably now about as SEO friendly as it can get. You have studied Google algorithm changes as they have occurred; you have revised your tactics and strategies so that you get those impressive back links; you have optimized your business blog and done all that you can to engage viewers so that they share your content. And, of course, content is one of the main factors in any SEO strategy. In fact, it is so important, that you may have even spent the money to get outside help in content gathering. You may have used sites such as Buzzsumo and others to ensure that your content is up-to-date and compelling. The more people reading it and sharing it, the more “points” you score with search engines.

What about your mobile SEO strategy? How is that coming? With no blog, as little text as possible, what measures have you put in place for SEO? Assuming that your responsive or mobile-first design has resulted in a mobile site that provides a good user experience, there are now some specific steps that you should take to improve your SEO. After all, according to Smart Insights, we are now past the “tipping point” where mobile users have surpassed those on desktops. The implications for mobile marketing are huge, and ranking high with search engines for mobile sites has to be a main goal. Here are the four SEO Mobile Marketing Strategies you need to do right away.

1. Keywords/Content

It is really easy to put keywords into your text on your desktop website. You do the research, you find those really effective ones, including long tail keyword phrases, and you get them into your blog post, within the text of your content, and in your meta descriptions. It is pretty easy to do. Not so easy on your mobile site. First, you have far less text; second, when you do have text, you cannot always use those long tail phrases that have been working so well for you. Remember that mobile screens are smaller; so are keypads; search terms that are typed in will be smaller too. Among mobile device users, then, different keywords may be more utilized than those you are using for your PC site. Get some research done involving mobile devices, especially keywords that your competitors are using. Also, see how you can reduce content as a whole. It is difficult to read on a small screen, and users will bounce if it becomes irritating. When users bounce, search engines notice.

2. Use Mobile Ads to Promote

Analytics, mostly provided by research conducted by Google, has shown some strong statistics in favor of mobile ad marketing tactics. In fact, they convert at a pretty high rate. And when each of those conversions occur, search engines notice. People on their devices who link to your mobile site or download and use your mobile app are providing information to search engines that they are connecting with you and often converting in some way. While you may not be using paid ads for your PC users, adding them to your mobile SEO strategy will be pretty critical. The money spent will be worth it, considering that more of your target audience will be on mobile devices. And if your competitors are not doing it already, they soon will be.

3. Put Money into a Mobile App

Almost two million apps are now available in the Apple Store and Google Play. They are downloaded at a rate of 45%, and 40% of people finalize a purchase after they scan a QR code. When you have a mobile app developed, consumers can learn more about your company; they have an easier time making purchases. And you can encourage them to download your app on your mobile site. The easier you make it, the more users you attract; the more users you attract the more popular you are in the eyes of search engines. It’s that simple. The other great thing about a beautifully appointed app that provides a great user experience, is that it will be recommended to others. You can also promote that download on your regular website, your blog and all of your social media platforms. As user download it, search engines notice.

4. Speed and a Bit More

With an ever increasing number of online searches, it is obvious that you must have a site that loads quickly and an app that downloads and opens at high speed. You have probably read the research that says your site and any page must load within 2 seconds. Any longer than 3, and you will have frustrated visitors who leave and don’t come back. Search engines don’t like that.

One of the things you can do to impact speed and user experience is to have a one-page site. A user can scroll down, and you can eliminate buttons that must be pressed by fat fingers to load another page which might be slower than it should be. Swiping is popular, and users like it. Now, it may not be appropriate for every business, but if it could be for yours, consider it. But you can test this quite easily, just as you should for every element you add, delete, or change.

Almost $105 billion worth of sales occurred via mobile devices in 2015. This amount will increase significantly in 2016. And people buy, via searching for sites that offer the products and services they want. Your job is to make sure that when those searches occur, you pop up. SEO on mobile is a bit different than that for PC’s – you can tweak everything you need to enhance your SEO and continue on that path as new algorithms and tactics emerge. You can’t afford not to.