I want to display a table with 4/5 columns and possibly 100 rows (as in desktop app right now) in smartphones. The table cells are also editable. Now we want to port this desktop app to smartphones (Android / IOS), what will be the most optimized way of showing this on Smartphones.
** I'm sure many people must've come across this problem by now, Is there some patterns or solution for displaying such kind of large data (editable) on smartphones.
Answer
When designing for mobiles, the first question you should ask yourself is, "Do users need to be able to perform the same actions while on-the-go as they perform at their workstations?" The second question you should ask is, "Can all of these actions be performed comfortably on all mobile devices?"
When you're dealing with 100-row tables, that translates to at least 7-8 screens on a mobile. That's not comfortable, especially when you want them to be editable. Editing needs to be invoked somehow, which is usually accomplished by tapping. The recommended target area is 9mm, so your entire table height can be as much as 900mm (90cm/0.9m/35.4in/2.95ft).
Thus, drop the editing capabilities and introduce some sort of pagination and filtering to improve usability.
There's also a similar question: How should large table columns be handled on a responsive design? and you can search for other mobile table questions for more ideas & solutions.
No comments:
Post a Comment