Start networking and exchanging professional insights

Register now or log in to join your professional community.

Follow

What is the difference between mobile app and mobile website design? And which one is easier to design?

user-image
Question added by Lina Samer , Digital Media Graphic Designer , iDirection
Date Posted: 2016/04/13
Sarah Ali
by Sarah Ali , Senior Evaluation Specialist , United Nations

There is a lot of confusion among organisations about how to deal with mobile. However, when it comes down to it you have 4 options.

Do you need an mobile app in the mobile app design store? Should that be native or hybrid? What is the difference between a web mobile app design and a responsive website? The world of mobile can seem incredibly confusing.

We have posted in the past about your mobile choices and attempted to bring some clarity to your options. However, I thought it might be useful if I demonstrated your choices using 4 examples of work we have done at Headscape. Hopefully seeing real examples will make it clearer what options to use in what circumstances.

The options are:

  • Responsive Website.
  • Native Mobile application.
  • Web Mobile application.
  • Hybrid Mobile application.

Responsive website

A responsive website is one that adapts to whatever device it is being viewed on. Whether that is a desktop computer, tablet or mobile device, the same website will display the same content using a visual design most suited to that device.

It is how Headscape build most of its websites these days.

Take for example Macmillian English. Like most of the sites we work on it is information rich. Users coming to the site are looking to find out information, rather than complete tasks. A responsive website ensures that they can find the same information whatever device they are using.

Responsive websites are good for…

  • Information rich websites.
  • Users that are looking to gather information.

If you are unsure what option you need then a responsive website is normally a good starting point.

Native Mobile apps design

Native mobile apps are mobile applications that run physically on the mobile device and are coded specifically for the operating system of that device. These are the mobile applications you typically find in either the Google Play or iOS Mobile app design Store.

This is the best mobile approach where speed and native features are required.

For example Headscape worked with Buffer to design a proof of concept iPhone mobile application.

Users interact with the Buffer mobile app design multiple times a day and need access to native features such as the camera roll. It therefore made sense for this to be a native mobile application.

Web Mobile application

A web mobile application shares characteristics with both a native mobile application and a responsive website.

As with a responsive website a web mobile application is built using HTML, CSS and Javascript and lives entirely online.

However, where a responsive site is content orientated, a web mobile application is task focused in much the same way as a native mobile app.

A case in point is the Blackpool Pleasure Beach mobile mobile app we built. The mobile application is available online but is not a content rich website. Instead it is a booking mobile application that allows users to buy their tickets and passes.

Because it required constant communication with the server, wasn’t used regularly by users and needed no native features, there was no point of making it a native mobile app.

Hybrid Mobile application

A hybrid mobile application is probably the hardest of the options to explain.

A hybrid mobile application is essentially a native mobile application built with HTML, CSS and Javascript. By building it with web technology it is quicker to develop and easier to publish to multiple platforms (e.g. iOS or Android). The downsides are that performance tends not to be as good and they lack the design style of each platform.

An example of this kind of mobile application is a proof of concept butterfly counting mobile app developed by Headscape. This hybrid mobile application was built in PhoneGap and allowed users to identify and count butterflies in the field even with no web connection.

We decided to build this as a hybrid mobile app because it was a proof of concept and we wanted to produce it quickly and for minimal cost.

Which is right for you?

Each of the 4 options discussed in this post have their place. Which is most mobile appropriate will vary based on your particular requirements. However, a good starting point is to ask whether users are primarily completing a task or accessing information.

If it is the latter then responsive is almost certainly the way to go. If it is the former then you need to ask whether speed and access to native features are important.

If that is the case then you will need a native or hybrid mobile application, otherwise a web mobile application would be perfect.

If you are still confused I recommend watching my presentation on the different mobile solutions.

 

Source: boagworld.com

Mohammad Nassar
by Mohammad Nassar , مهندس نظم المعلومات , المقاصة سبورت

the mobile app is software application run on mobile device and the mobile storage have mobile application data.

but mobile website design is website run on website's server this server including website's data & files and the website design compatible with mobile display 

Mobile application is an executable thing, which you can install in your phone. Websites are hosted on servers and no installation is required. Well, the ease of design depends on your knowledge. Mostly, web designing's easy.

Mohammed Borham
by Mohammed Borham , Senior Procurement Engineer , Saudi Bin Laden Group

The app design is done by programming languages like Java or android studio. The mobile web site can be done by html language

Amer Salloum
by Amer Salloum , Website Design and Development , freelancing

for (responsive) website design for mobile, it is converting the website into a responsive design that divide the website screen into2 or3 parts and display it above each other

tools: photoshop, illustrator

 

for the mobile application you should keep in mind that the application should be simple easy to use and the user finger place (you should keep the buttons in the right way so users can click on it easy)

also keep in minde the ratio of the screen while designing.

Tools: Sketch, photoshop, illustrator

Mostafa El-sabaa
by Mostafa El-sabaa , freelance UI Developer , FreeLancer

Mobile App is developed with native languages ... Android (Android),  Iphone (IOs) BlackBerry(MEP) somthing like that 

 

mobile Website design is totally HTML 5 , CSS 3 and Java Script (Jquery),

 

I think the Best for developing is the Website design if we don't need any integration with the Mobile App 

 

else the native code 

Muhammad Yuseef
by Muhammad Yuseef , IT Manager , Master Point Trading

Thanks for the invitation , I'm not an expert butt I found this link helpful ,

 

Here

 

Waiting for experts contribution 

Yosef Abdalsalam Mohammed
by Yosef Abdalsalam Mohammed , IT Manager , Al-Alamiya for Furniture

You can build an app by creating a responsive web page to Mobile phones, but if you create the app you can add much more features, but the easier way to design is to design a page

Rehan Farooq
by Rehan Farooq , WEB DEVELOPER/DIGITAL MARKETING EXPERT , Upwork

Mobile APP usually called Native App, is a bit hard to develop as there are many things involved in it.

However once can accomplish it via PhoneGap easily!

 

Mobile responsive websites are the websites which are compatible with mobile phones. Its very easy as compared to mobile apps.

Lamis Abdulrahman Ghailan Al-akhaly
by Lamis Abdulrahman Ghailan Al-akhaly , متدرب , natco information technology

I agree with Muhammad's answer..

More Questions Like This