Where to find examples of admin layouts?

Question

I am a software engineer. Every app I work on includes the need to create, read, update, and delete records. There is a list of records. You can add a new record. You can view, edit, or delete a record.

I mostly use Ruby on Rails. Rails provides a great tool for getting a UI built quickly (called the "scaffolding generator") which generates the layouts for create, read, update, and delete, but it's not exactly pretty. Frameworks like Twitter Bootstrap have become a great resource for quickly building attractive layouts using common UI elements, so most of my projects use Twitter Bootstrap. Yet, I've never seen any design examples of listing and editing records. I want to find best-practice examples of these layouts that I can imitate.

I have questions like:

• Where should I put the "Add New" button on the list page. Should it be next to the heading, floated right, below the list, etc.?
• Should the "view" page display an "Edit" button. Same questions apply: where should it be placed?

Can you provide examples of these layouts, or a link to view design patterns that I can imitate?

Update:

To clarify, I'm not interested in admin dashboards. Examples of dashboards are easy to find. http://ui-patterns.com is a great example of what I'm looking for because it details the problem, solution, and when to use it. However, even on UI Patterns, I can't find an example of simply "adding and editing data".

Answer 1

To answer your questions first:

• the "Add New" button needs to be immediately visible, regardless of the user's screen size or the list's length. That being said, at the top of the list seems to be the most logical (or KISS) choice. What I'd argue is equally important is to make that button really stand out (using color, size, whitespace...).
• As for the "view " page - the "Edit" button you asked about would then presumably be available for each of the entries, right? If that's the case, then something simple like Twitter's way of hinting tools for each tweet and then making them completely visible when the item is hovered should suffice.

As for the inspiration in Dashboard design, I'd always recommend checking out PatternTap first, as it has listed mostly already implemented UI, already put to work. You could start with http://patterntap.com/?sort_by=created&type=81&style=All&platform=All&page=1 and modify the search as desired.

Other places where you could look for inspiration are Pinterest or Dribbble, but the latter is certainly more about interesting and nice looking ideas than it is about validated solutions. However, depending on the need, both can be quite useful.

Hope this helps!

Answer 2

You should also check out the site UI Patters. You might find inspirations that would spark you with ideas of what you could do, but also (and sometimes more importantly) what not to do :)

You could also check out Dribble for inspiration.

Finally, you should read this post about "The Laws of Sh!&^y Dashboards" ... it's a great read

Also, I don't agree with all the trends listed here, but [this is a good article][3] that summaries a lot of insights.