Subnostr

My first problem with the nostrocket problem tracker is that I can't seem to log problems 😂 . So I'll do it here for now.

Problem: This will probably become an infintely nested tree of problems. So indentation is not gonna work past 20 or so levels (on desktop, let alone mobile).

Possible solution:

Combining Miller columns with an Email inbox-like layout could be something. You can still see the parents and easily scroll back or expand a certain level again and you have a clear overview of all the problems on the same level.

Also, on the opened level I'd avoid an extra click on a problem and already show the necessary info and buttons (log subproblem, status, tag, claimed by...)

Lastly, a sidebar menu seems better to me for this kind of app. Keeps nested notifications/categories in sight.

nostr:npub1mygerccwqpzyh9pvp6pv44rskv40zutkfs38t0hqhkvnwlhagp6s3psn5p nostr:npub1arkn0xxxll4llgy9qxkrncn3vc4l69s0dz8ef3zadykcwe7ax3dqrrh43w What do you think? #nostrdesign

Reply to this note

Please Login to reply.

Discussion

arkinox 2y ago

I love it!!!

arkinox 2y ago

I see someone has added you to the #nostrocket identity tree, so you should be able to login now via extension and log new problems! Let me know if it works

Niel Liesmons 2y ago

I did all that, typed full problems, clicked log and I can't find 'em nowhere 🤔

arkinox 2y ago

OK. Would you be able to give us some text to look for?

nostr:npub1mygerccwqpzyh9pvp6pv44rskv40zutkfs38t0hqhkvnwlhagp6s3psn5p Can you look into this?

gsovereignty 2y ago

I'll look into this when I wake up, thanks for the heads up!

The design looks significantly better than what we have at the moment and not too hard to implement, I like it.

Niel Liesmons 2y ago

It works now, found the problems. Don't know what it was and sorry to have bothered you with that.

gsovereignty 2y ago

Nope, no bother at all! It's probably a legit problem that only happens randomly for some reason, those are the most difficult to debug

Vladimir Krstić 2y ago

This is super interesting. You have a column for each level, right? If that's the case, that would be a lot of horizontal scrolling and unnecessary scanning. It would be overwhelming on desktop and claustrophobic on mobile. Also, keep in mind that many desktop users don't use a trackpad or a mouse with a horizontal scroll wheel.

We should ask a question - what's the most important content a user needs to see at a glance? Probably:

- Active Problem

- Parent Problem

- Top Level Problem

What content is of medium importance? Probably:

- All parent problems (going all the way up to the top level)

- Child problems

What content is of low importance? Probably:

- Sibling problems

- Parent's sibling problems

So how would I do it?

We have a top-level problem - Problem Omega, and we are located at Problem Delta, which is buried 22 levels deep. We see these two at a glance. Between these two, we have 20 levels stacked. We don't need to scroll through all of them. We can expand and see the whole path down if we need to. Eventually, we can click on some of them, and at that moment, it becomes our active problem; it replaces Problem Delta. Now, if we jump like this, we would definitely need: navigate back, navigate forward, pin, or bookmark functionality. Below Problem Delta, we have his children. We don't have to stack them as they are below.

Here, I was thinking only about the most strip-down version, a mobile version. That's because it is easy to add things but super hard to remove them, so it's always wise to do a mobile design first.

Hope this helps. Cheers!

gsovereignty 2y ago

I was wondering who would be the first to notice that it's using carbon!

Your observations and notes here are seriously helpful and really awesome.

Have you worked with carbon before? I find it really difficult to do any frontend/design/layout stuff in general, but carbon definitely makes things easier.

Niel Liesmons 2y ago

Man, I love having you in my feed! Great input again.

I started from mobile with very similar sketches to yours but from a different assumption:

That you only really need to see the two previous levels (and not the very Top level) and then scroll up from there.

I see users mostly following a pattern of 6 steps down, 2 steps up. Similar to how they browse deeply nested documents.

On mobile I thought of something like this:

https://cdn.satellite.earth/dac0ffb69394b9dc528e2439c7557ad57d75c430bbe325e67629134b5f3952ef.mov

On top it shows the parent and you can horizontally scroll through the path or click the show/expand path button.

gsovereignty 2y ago

Hey nostr:npub149p5act9a5qm9p47elp8w8h3wpwn2d7s2xecw2ygnrxqp4wgsklq9g722q I saw the problem you logged for this, thanks!

This is a really difficult and complex problem, and it's good to distill/focus all the research and designs etc from you and nostr:npub1t3gd5yefglarhar4n6uh34uymvft4tgu8edk5465zzhtv4rrnd9sg7upxq in one place, which is better done by someone who understands UX design rather than someone like me who does not.

It also makes it clear later on that you made a big contribution in case the project is successful 👀

gsovereignty 2y ago

FYI you should be able to edit the problem to add the research etc, and markdown (with images) is supported

Niel Liesmons 2y ago

Cool! 👍 I'll do that.

Vladimir Krstić 2y ago

Just saw that nostrocket is using IBM's Carbon design system. That's a top pick for applications with dense data like this one.

Niel Liesmons 2y ago

Why is that? I'm blinded by how much I dislike the aesthetics 😉

HoloKat 2y ago

What’s this? How does one test this

Niel Liesmons 2y ago

https://nostrocket.org/problems