↵

Pain points for designers in 2018?

5 years ago from John Low, Developer BBA

  • Michael Ragland, 5 years ago

    I work in fintech, and a tool that would help me make customizable high-fidelity data tables and charts would go a long way.

    For tables even just adding a repeat grid function in Figma would do wonders for me, but it would be way cooler if it could populate the cells with data.

    4 points
    • L W, 5 years ago

      can you upload or link to a sample of the kind of data tables / charts you want to produce?

      1 point
      • Michael Ragland, 5 years ago

        Sure. I would love the ability to easily add rows, columns, numerical and string data, select groups of layers as rows or columns (though I cannot think of a way to make this practical), and resize width of columns.

        There may be a better way of building tables in Figma, but to be honest I'm not sure how.

        https://www.figma.com/file/Llnhde1Vxs6cgu77evwWDU/Public

        Charts would include mostly bar graphs and line charts. These are much more straightforward to build, but I could imagine tools that would make it easier and faster.

        1 point
        • Thomas Lowry, 5 years ago

          Check out the data table I created with nested components in Figma as part of this Material design resource:

          https://www.figma.com/file/NMeZfmwo9Nhqi72S0bw3Tn/Android-UI-Kit/duplicate

          (the data grids are on the far right arboard).

          Usually what I like to do is assemble a basic table using nested components. I try to keep it as modular as possible. For most standard tables, I find its useful to have the columns as components, and the rows as a repeating separate component. If you make the columns as part of your row, its harder to customize since you need to detach and break the component to modify the contents. You can sort of make your own repeat grids.

          Take a component (one row for example). Then make a new component with that row duplicated 20-30x. Then turn that grid into a component. Set the constraints to those nested rows to be Left and Right + Top. There is a feature in Figma called “clip content”. If you enable this, you can resize the component, and it will crop the repeat grid. So when you want more, you just drag it down to expand the size and reveal more rows.

          Once I have all the setup, I package them up all assembled in a component to create a sample table. When I need a table, I drop in the sample table from our shared library, break it apart, and configure all the nested components how I want them.

          Posted a bit about it here: https://twitter.com/negativespaceca/status/1002635034505850880

          2 points
    • Chris Aalid, 5 years ago

      Axure can do a ton of this kind of stuff. Not super intuitive for hi-fidelity mocks or prototypes but for really interactive wireframes or lo/mid-fi mocks it's pretty great.

      1 point