Mobile First for Enterprise Applications?

Question

I'm working on a fairly complex Enterprise Web-Application which will mostly be used with desktop computers. However, it also needs to work with mobiles and tablets, although this will be less common.

The feedback I have from users so far is that it'll be approximately 80% desktop, 10% tablet (iPad) and 10% mobile.

In the old days, it would probably have made sense to create a separate mobile application, but that seems to have become déclassé.

The question is, how to approach the design for UX/UI/Layouts, etc when a desktop-oriented design will be useless on a mobile and vice versa?

I get the shwoing/hiding of content depending on device, etc, but there must be more to it than that, some more sophisticated techniques applicable to web applications.

Answer 1

the question is IMO fairly broad, so my answer will probably reflect this

First of all, separate applications per platform are not déclassé, they live side by side and the choice for one or the other really is about the purpose & needs of the application + the performance that you want to get, full native app vs. web app will have a huuugeee difference in performance :-)

This article might help: http://www.nngroup.com/articles/repurposing-vs-optimized-design/

I'm going to assume that you'll do just fine with a web app though.

The mobile first aproach isn't really about hiding on or the other based upon end-system, its more as a way of rethinking your design. Starting from the mobile, you'll notice that you don't have the big screen, the mouse (for visual hints etc.), and so on. This limitation often lets you think about the most important things that you want to show. This doesn't necesarrily mean that some things are there on a desktop and are gone on a mobile screen, as doing that might lead to a lot of frustrations. On the other hand, don't try to be too obsessive with a clean UI by, for instance, stuffing everything behind a hamburger icon.

That being said, there are choices to be made regarding implementation, as you have mainly 3 categories to do what you want to do:

• Make a mobile version of the site (only mobile users)
• Make your site/app adaptive (at certain resolutions you give a certain layout)
• Make your site/app responsive site (one step further, as you fluently try to optimize for every resolution)

Note that any of these takes extra work, and if you're not going to do it correctly then it will be the same as not doing it. Anyway, the following frameworks are available to try, so perhaps check them out and see if it helps:

• https://jquerymobile.com/
• http://getbootstrap.com/
• http://foundation.zurb.com/

As you're starting to realize, the answer is not as easy as just: use this framework and done! It will take some effort to figure out the primary and secondary functions of your site and knowing if it makes sense :-) Before you dive into the coding, you must do some tests to validate the assumptions, knowing that you're on the right track.

If you like, I can zoom in more on certain aspects, but for now, I just gave the broad answer

Answer 2

Regardless of current stats, what direction will they move going forward? Inevitably, mobile use will continue to increase.

Therefore, it makes a whole lot of sense to think about mobile first.

The other advantage of mobile-first is it makes it that more obvious as to what truly isn't needed in the UI--mobile or desktop.