do internets

on internets doing computer

« Back to blog

Tip: Photoshop Layer organization for Table-like data

Pstables

Working with design elements in a table within Photoshop can often be a major bear. Your beautifully organized folders and layers can quickly spiral out of control into a headache inducing crap-load.  I have found it far more beneficial to arrange my elements and  layers in Photoshop by the columns of the table, rather than rows. This seems to make sense to me because - usually the objects in a column are of the same type. Also, because PS layers are arranged in a vertical manner - this seems to match columns. Often, you can even use one text block for the data of an entire column - and use the Line-spacing in the Text inspector panel to space each item into it's row.

It's not a perfect solution - but when someone proposes mass changes to a data-heavy Photoshop design* (see footnote) - it is far easier if your columns follow your Photoshop layers, rather than your rows.

======Bonus related tip=====

*Note: You may be asking - Wait! Why is there real data in your Photoshop file at all? Isn't this a mock up or something? Shouldn't it be placeholder stuff?

Yes, it is a mock up -> However, very often mocks are used in presentations to investors. Ideally, people (users) who view presentations could simply be told: "This is a mock-up: Don't be concerned about the content at the moment...," but in my experience, this NEVER works. Your presentation that is designed to show a mock layout is going along and suddenly, "Why does Dr. Brown only have X number of patients? That value doesn't make sense..."   ...and your whole presentation is railroaded by a question outside the scope and purpose of the mock-up. This is why people use dummy/placeholder data. However - dummy data often doesn't give an accurate portrayal of the info that needs a design, and furthermore, usually doesn't even achieve it's goal of avoiding distraction: "Why is that section in Greek? Our users are primarily English speaking.... Who is Lorem Ipsum?". Again, in my experience, it is far preferable to design around real values.

As a UI/UX person - this is a very frustrating trade-off - but you have to accept reality sometimes. Users (here - viewers of the presentation) have specific concerns about things. Thus, the easier you can make it on yourself to control and organize the data in your PS mock-up files - the better.

Posted August 4, 2011 by Andrew C