Consequence of not creating variation for large screen resolution

This one's highly subjective.

I'm converting a functioning prototype application into ASP.NET MVC.  It features a complex graphic and a complex custom "list" (stack of divs with formatted text, not table, or li).  It's used for collaborative process design.  It's currently got 100K+ lines of C# and maybe 25K of JS.

It's the kind of thing that's likely to shared via Webex or similar utilities.

The JS and CSS currently all use fixed pixel dimensions, based on the assumption of a 1024x768 screen resolution...except that many of the element dimensions are dynamically created in JS anyway.  

The business model doesn't require a mobile version, for now, so I don't have to worry about smaller resolutions.

My concern is that the target audience does include IT project managers and business analysts, along with other knowledge workers.  And I'm seeing more and more of them use higher resolution monitors (like 1600X1200 or more).

The graphic has  a slider that can increase or decrease the size of the graphic and graphic labels from 50% to 200%.  Needs some fine tuning but mostly works ok.

I'm thinking I can build a similar slider to adjust the div and font sizes of the "list".

But the whole thing is still currently locked into this 1024x768 based-layout of fixed divs.  I suppose I could make that adjustable too.

I see and generally understand the many techniques available for detecting screen pixel dimensions, using % for dimensions, using alternate css for different screen sizes etc.

Having said all that, the question has three parts:

1)  Any thoughts about how many business and IT staff (not hard core engineers, particularly) are using their monitors at 1280X960 or more?

2)  Any thoughts on how much negativity would be engendered by not having the app adapted to higher resolution screens?

3)  Any thoughts on the relative effort of going ahead to make the app responsive to higher resolutions, given the total amount of code it contains now, the large portion of current code-based size setting, and the built in scaling functions?  (And I could convert first, allow for the sizing, and refine the sizing later)

As I said, highly subjective.

Who is Participating?
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
Making it responsive is a good idea.  However, that does mean you now have to think of each rendered page as a phone, tablet, partial desktop, full desktop and somebody using a very large screen or super high resolution.  

You can use media queries and make up your own versions for each  However, there are some great base projects in bootstrap and foundation where both are based on a css grid and multiple media queries you access by giving a div a class.  http:Q_28406542.html#a39982826
<div class="row">
    <div class="col-xs-12 col-sm-6">Stuff</div>
    <div class="col-xs-12 col-sm-6">Stuff</div>

Open in new window

Your 100K lines of C code or 25K lines of js only come into play where you are generating the divs.

Part of the consideration in doing this is not just hiding, unhiding and moving things around, but you want to think of images as well.  If they are on a 2000px wide screen, chances are it is ok to hide the lower res, smaller images for the slider and use larger images that can be near 100% of the actual width.  This will keep them looking sharp.

This is not a small task, but in the end it is worth it to explore.

At the very least, you can use a simple media query to detect a 1600px viewport and adjust the slider.
codequestAuthor Commented:
@Scott:  thanks for your input.  It helped me see that this is do-able and reasonably important.  Since this the project is a conversion/enhancement, I won't have a clean code architecture to work against, which would make adding multiple screen sized much easier.  So I'm going to make notes for this as I go along, and implement it in release 1.1+.
Big help on getting this resolved, though.
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Glad it makes sense.

I would practice on a simple html site and convert that to bootstrap to get a feel for what needs to be done.  

Best of luck!
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.