Structure : Get rid of modals

DO VOTE || OR LIKE !!

@bastianallgeier

1 Like

I hope not everyone starting to post their favorite issues like this, because that would be about 100 extra posts in this forum. :stuck_out_tongue:

Its not an Issue it´s a suggestion, and why shouldn´t we do that, why do you think there is a suggestion category !? I seriously hope everyone does exactly that, then MR. @bastianallgeier can get his feedback !

I already got it. You have been loud and clear on Github :slight_smile: It’s just not a “hey let’s switch to something differnt” solution, which takes 5 minutes to implement.

1 Like

On a side note. I’d really prefer to keep the tone a bit more decent to be honest. Uppercase or sentences like “I absolutely hate ____” always feel very aggresive. I do my very best to read all your wishes and suggestions and implement them whenever possible — as you probably have already noticed in the past. It’s just not so easy anymore to move forward quickly with a small team and thousands of users, without seriously breaking stuff.

5 Likes

I got it, and yeah i most definetly know that there is no 5 min implemention, the structure field is burried very deep in the panel core…

Ok will do better, but on the other hand I don´t like people who think they know or think they are better than others… We are all beginners in the beginning… lol

I hope not everyone starting to post their favorite issues

I am told that the suggestion category in the forum is for discussion of a suggestion first. Then if people agree it’s a good and clear suggestion, then add it to Github.

When it’s added on Github, I’m sure it’s seen by @bastianallgeier. If it’s added here, just maybe.

I don’t think I’m better than you. Sorry if I was rude. :slight_smile:

Yes, that workflow makes a lot of sense. It’s super hard for me to keep track of stuff in the forum, while it’s easier for you to discuss things here. @texnixe and @lukasbestle are constantly copying stuff over to the issues section on Github, so we can use it as a checklist for the releases later. I feel that this works really well. So there’s actually no need to readd stuff here again afterwards unless the discussion is needed and missing in the forum.

1 Like

Ok, didn´t know that workflow, noted, sounds good and make sense, sorry for posting twice then !

2 Likes

Perhaps it´s just because I think kirby is currently the nr: 1 cms solution for small to medium companys, and care about it ; ) lol :heart_eyes:
I have tried statamic, grav and so on, formerly a Episerver, Drupal, Wordpress designer / dev…
and do rate Kirby as nr: 1 so far… becuase if the clients like it…I like it…

1 Like

I totally appreciate it and it really means a lot that you all are so passionate about it :smiley:

Maybe to turn the discussion: how could a solution look like? How could that work on small and big screens? I think this is much more complex than it seems to be.

Why is a modal dialog so bad?
I think the modal dialog is a good solution to enter the data for a structure field item. Nevertheless it brings also some usability problems with it. A modal dialog can’t answers key questions that are important for the orientation of the user - where he is, what he can do and what happens then. These questions are only answered because of the context.

Because the user has clicked on “Add row” in the section “Events”, this modal dialog has opened to add an event to the events section.

Imagine: Maybe the structure field represents a database of profiles or of events that will be entered from an email or a sheet. Therefore the user has to jump between many different actions - searching the right email, finding the right row in the sheet, checking if the found information is correct. In the end he jumps multiple times forth and back to enter the correct information into the complex structure field item modal dialog. It sounds crazy but it’s hard for the user to re-answer the question where he is, what he is doing and what happens then after multiple different actions. In other words: he has to think the information what the user interface should normally say to him.

Some other possible problems: A modal can feel wrong when the section item is much more complex so a modal dialog is too fragile and too temporarily from UX sight. And for the sake of flexibility: structure fields could never display an own modal dialog for a special form field, nor could have an own structure field per item.

Possible solutions
Let’s think about that: after clicking on “Add”, a new page with all form fields could appear. This is a really easy solution that works on every device but this feels really off the context. So a solution is needed that is more on the context…

In terms of direct manipulation, the inline editing could help to add and edit a structure item inline. Clicking on “add new” adds a new row that has two states: edit and display state. Here’s a prototype that visualizes the idea: http://okydaf.axshare.com. That also means: editing a structure field item happens inline. The usability problems of a modal dialog disappear: the user always has the visual context of the structure field and - because it’s inline - he knows that he’s editing or adding an inline item in that section.

Alright. What’s the problem?
As long as I’m using Kirby, the structure field is really a swiss army knife for me. It can contain everything - except another structure field. There are so many use cases for that swiss army knife that really brings @bastianallgeier into conceptual problems, because it’s unclear how complex a structure field can be and if an in-line solution can also meet the use cases for that. That’s why a modal dialog is an easy solution to bring the flexible beast into it’s cage.

The inline solution can be a better solution, but because of it’s unclear which and how many complex structure fields are out there, it’s just another solution that can or cannot fit into the individual use case. Plus: because of the 33% width sidebar, the margins, etc., an in-line solution can be very long and also visually very unclear for the user - and also hard to use for smartphone clients.

What do you think? What other solutions could be possible?

4 Likes

Thank you all for moving forward slowly and carefully. Keep up the good work. (And, btw, I don’t care about modals at all —and even think you chose their use wisely.) Yours sincerely, Moritz

1 Like

On a project I’m working on, I tried “builder” plugins (Kirby Builder, Kirby Modules, Snippet Field) but ultimately decided not to use them because of the modal.

My use case is pages with a mix of text and images, like long blog posts with “modules” in between text sections, for example a “title + image + some text” section.

The modal had two issues for that use:

  • When you edit a section you can’t see the rest of the content, so you loose context ;
  • editing becomes tedious. To simply move some text around you need to: click edit to open the modal, copy text, close modal, scroll to another section, open modal, paste, click ok.

This plus workflow concerns with that kind of modular content made me choose another way (markdown + custom tags) for now.

An example of interface without modal that I think would work for my use case is Sir Trevor.

1 Like

I have the same problem with Builder and modals.

Did you looked at this one

Looks good but what about this?

WARNING: This is still in early alpha. Use at your own discretion.

I tried this plugin today, is realy nice… and “everything” seems to work.

But there are some missing functionalities : you can’t change modules order with drag and drop for exemple.

It’s definitely buggy but let’s try and change that! It looks like a good base

I tried this version : https://github.com/frekw/kirby-modules-example