0

What's the best solution for responsive holy grail layout in the context of complex responsive design?

enter image description here

Some common layouts done in this way

Hubspot CRM

enter image description here

enter image description here

Problem: it doesn't work on mobile as most of the apps built this way. Same thing with Atlassian Jira. They both have mobile apps. None of them are responsive I can't afford building a mobile version for my project.

The best thing I found was which seems a mix of responsive with adaptive: Outlook 365 enter image description here

When the left pane is minimized, it can be triggered from a sub menu link: enter image description here

I'm looking to design an admin dashboard / ERP manager layout without too many modal popups. This is my current desktop layout (1440x1080):

enter image description here

enter image description here

When a company account is loaded, it displays a list of licenses (left), details of the license (middle) as well company information (right). If I click on the middle, intead of a modal popup, it loads a closable widget on the right side to continue the action, for example generating an upgrade code for license 111111

I wonder if following outlook would be my best choice? Or is there something that be done to make mobile better, such as adaptive if responsive is not the right choice at a smaller breakpoint? Or building with multiple modals is the best thing for this case? How would someone adapt this type of layout to a mobile without rebuilding the entire front-end as a separate version? Would material design layout handle this better? I'm also looking for possible suggestions on design systems layouts with open source code so I can find an existing solution in terms of code

2
  • 1
    Depends on your definition of 'best'. Best UX means that taking the different device, environment it's used, screen size, etc into account and design the mobile application accordingly. Because it is so different you do not see many responsive apps from mobile to desktop, they are usually quite different.
    – Martyn
    Dec 26, 2020 at 0:20
  • Good enough for workable in small screens (iPhone 8 for example) but the majority of of the work will be done in 1440 x 1080 laptops Dec 29, 2020 at 22:40

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.