Designer(s) needed! - Githubissues

janhartigan commented 11 years ago

Hey guys, I'm just throwing this general request out into the void to see if we have any takers. I am, by all accounts, quite a mediocre designer. As you can see with the release of 3.0.0, I'm not completely incapable of making decent-looking menus, but there are bigger issues afoot. Namely:

We need to come up with a better solution for the edit form. This is a difficult problem, but I don't think it's intractable. Right now, the default behavior of the edit form is that it slides into position over the filter form when a row is clicked. This behavior does have some functional benefits: you can still select/see the rows on your left while editing, so you don't need to hit "close" to select another item. However, some edit forms can't be confined to such a small space (specifically WYSIWYG, markdown, or large multi-relational fields). In this case, the edit form can be set to expand to an arbitrary width. Then when an item is selected, the result set shrinks. Others (@gilr) have already suggested that we could optionally let developers choose to have the edit form roll over the result set instead of scrunching it. This does seem to keep the both of best worlds, but I want to exhaust all possibilities before deciding on a solution (or set of solutions).
I'm not 100% happy with the fonts
I'm only about 40% happy with the existing color scheme
Any problems that I can't see that someone with a good design eye can see

Thanks everyone for using Administrator so far and posting all issues. I don't expect a major response to this request, but even some minor input/opinions would probably help a lot.

andrewdworn commented 11 years ago

In the first few days of using administrator, i believed that it uses bootstrap for design : )

Have you considered using bootstrap? Is it even possible/convenient with knockout?

I like the current design a lot (of course, mentioned adjustments are welcome), but a generalized theming functionality would be also great.

I can also imagine a variety of templates (and themes), so i could chose the best fitted template for each project, let's say setting an administrator config parameter.

deminua commented 11 years ago

Add JS-click "Full Edit", in a WYSIWYG, image, upload ... large fields.
Web fonts: Arial Arial Black Comic Sans MS Courier New Georgia Impact Times New Roman Trebuchet MS Verdana
https://kuler.adobe.com/#create/fromacolor

demogar commented 11 years ago

I like how Active Admin looks like: http://activeadmin.info/

In any case, I think a better approach to switch everything to Twitter Bootstrap, so you don't have to think about design.

samcgarry commented 11 years ago

I am not a designer but I am just wondering - does the filter form need to be in a side bar? I would probably have put a filter above the results a bit like a search bar so you see the results below. Alternatively perhaps an entry box below each header field that allows filtering? Or maybe a funnel icon you can click that brings down the filter form?

One other thought... Rather than the edit appearing to the side of the list, could you not have the default behaviour to open an 'edit row' which is like the current display row but with edit boxes and the save buttons? So you click a row and it zooms up with an inline form? I suppose it could be tricky with some of the edit fields like wysiwyg.

samcgarry commented 11 years ago

I'm not sure if this is a design issue, or a feature request but I've just been thinking it would be nice to have a count of how many results there are, but I'm not sure how to add this without cluttering up the view. Currently you see page 1/x depending on how many results are on each page, but you don't know exactly how many items there are in the result set. This could change based on filters, or even be extended to show how many items have been filtered out?

fedeisas commented 11 years ago

@janhartigan this bundle is amazing. You Sir have done an excellent job. Nevertheless, sometimes I wonder why did you go the Knockout.js route. It seems like a LOT of extra work just to have in-place editing. Same goes for pagination or filtering. Please don't get me wrong: it works great! But, the main design problem is given by the width of the edit form. We need a full-screen view for editing. ActiveAdmin does it. If you get rid of all the JS stuff, the whole thing became much simpler, less code, less bugs, easier to unit test, etc. Just my two cents.

janhartigan commented 11 years ago

@fedeisas knockout actually makes the management of form states much easier. I've had the fewest bugs from the knockout side of things, unit testing would be set up roughly the same regardless of how I set up the front end, and there's nothing explicitly stopping me from converting the edit form into a full-page form with knockout. The beauty of knockout is that it lets me reorganize the HTML any number of ways without worrying about it breaking the design. The reason why I initially put the edit form on the same page as the rows is because there is a major benefit to being able to select a new item with one click instead of two, and it's sometimes really helpful to be able to quickly compare one detailed item against the full result set.

But all of that said, there is room for improvement. I want to think of a way to keep the best of both worlds. Possibly through user choice in the interface.

alex38 commented 11 years ago

+1 on this whole conversation. I just posted in a (newer) related thread about the Edit Form: https://github.com/FrozenNode/Laravel-Administrator/issues/337

I like the idea of seeing the list next to or behind the edit form but to me that's a nice-to-have, after:

1) seeing the edit form immediately when you click. https://github.com/FrozenNode/Laravel-Administrator/issues/337 mentions the issue with being scrolled down past the edit form.

2) a full page edit form.

Weeblewonder commented 10 years ago

Was just searching through the issues regarding the form size as it is the biggest issue of mine. Its ridiculous to restrict the form to just 250-odd pixels wide, as mentioned above when working with WYSIWYG fields.

I suggest perhaps just making it configurable on in the model configuration

'edit_form' => 'inline'  // as currently implemented
'edit_form' => 'overlay' // slide it out further across the screen or have it as a popup
'edit_form' => 'full' // just display it full screen, either similar logic to now 
                                or using a dedicated page ie admin/model/{id}/edit

janhartigan commented 10 years ago

I agree, and it's something I was keeping in mind as I made the media queries to handle smaller screens. Administrator does have a responsive layout, and I think taking lessons from how that works will be crucial in deciding how best to handle this. In any case, I think this is something that the user should decide, not the developer. The developer perhaps should be allowed to decide the default, but the user should have more layout options available to them on the admin screen.

spaceemotion commented 10 years ago

I also noticed administrator not taking away the "Filters" sidebar when you haven't even defined any. Any chance for a fix to this (Hope this is the right conversation for this, if not i will open a new ticket)?

janhartigan commented 10 years ago

@spaceemotion thanks for the suggestion. Could you open up another issue for that?

FrozenNode / Laravel-Administrator

Designer(s) needed! #63