Kinopio Sidebar Idea

[kordumb]

Cross posted to FL, I’ll also write a little bit more about why when I have a chance later:

Quick and rough idea for a Kinopio sidebar I’ve been thinking about for awhile. Button in the top right slides it over or pushes it back like FL.

Only showing Tags and Links here, but I feel like this would be a cool space for Comments to live if you ever implemented that idea from the forum.

I’m also thinking it could be modular a bit, so if you ignore the toggle at the top, what if Links were shown at the top and Tags below in the same sidebar. (Or if Comments, Spaces, etc. existed here, you could toggle which are on and then reorder them)

Once the side bar is “opened” I’d consider it “pinned” until the user hits the arrow to push it away, essentially the Pin button wouldn’t be needed.

[pirijan]

Cool idea for comments, would these be separate from card comments?

[kordumb]

Yeah, I think it’d work well for what Ben had previously mentioned around a way for people to comment on a space, but have them out of the way and not “a part of the space.”

You would lose the ability to connect things like ((current comments)), but it might add a level of community and interaction where people won’t feel like they are “messing up” a space.

[bentsai]

What if you could connect comments in the sidebar to cards in the space? Those connections would be hidden as soon as you hide/collapse the sidebar.

[kordumb]

Yeah, I thought of that and figured it’d be tough, but agree that would be awesome. Each comment would be a little stacked card in the sidebar; you can have any combo in any order of links, tags, comments to show in the sidebar, and have the state of which are flipped on and in what order remembered across spaces anytime you open or close the sidebar…

[pirijan]

so basically a comments sidebar would be a summary of comment cards in the space, rather than a place to write new comments that aren’t tied to cards?

[kordumb]

My thought was no. Comments in the sidebar would be different than in the Space.

I’m thinking you should be able to add comments to a space you don’t have write access to.

[Hildegerd]

If the sidebar only pooped up when sombody commented, it would be cool, but no permanent sidebar.

[kordumb]

With the new comment dialog added, I updated my mock-up a bit to incorporate what that could look like in my “Sidebar” and included some additional thoughts as well.

1. Still have the little grab handle at the top left of the sidebar - this is used to close it (and would poke out as a button in the top right of the screen to open on command [keyboard shortcut would be great here too to pop it open and close])
2. All three buttons for Tags, Links, and Comments are shown grey here - meaning they are selected. You could select one, two, or three of them, and whichever are selected would display.
3. I replaced the Pin icons with a three line icon. This can be used as a grab handle allowing you to reorder the three dialog boxes if you have more than one selected.

A big reason why, for me, the sidebar is a better implementation than the dialog buttons in the bottom left is because, to me, the bottom left is more valuable real estate, especially on a smaller screen, which makes these less valuable, because I can rarely have them pinned open on iPad. The far right is ideal to fill in some of this meta information and I’d be able to basically keep this open 100% of the time, at least in my regular use, but still have the ability to close it when I want to hunker down on a non-journal, more “thinky” spaces.

Bonus rambling thought: I’d probably think of a set height to use and have a little scroll bar depending on how many are selected so the space is used efficiently i.e. if one is selected, it can be the length of the whole sidebar, if two each would max out at 50% height, three = 33%. There is probably some logic you can do so that if comments wouldn’t need 50%, you could give extra space to the tags, but essentially each should have a good chunk of real estate and be visible in the sidebar.

Okay. I rest my case. Love the commenting improvements though.

[bentsai]

Taking a step back, had the idea that a sidebar would be a cool place for a list of all cards in the space. Then you can filter it by comments, URLs, images, tags, etc.

I think being able to see and take action on cards in list form is a pretty powerful thing. Like a lightweight bookmark/media manager. List of contacts. Todo list. Sort by creation date. Filter by creator. Filter by tags. Etc

For sure this overlaps with the existing card search functionality. But I think having something more permanent makes this much more useful.

[kordumb]

100% love this idea.

Great thing about a flexible, modular sidebar (besides the complexity of building) is giving people lots of options on what pieces they want to use at a given time.

Could also see this as a Pro feature, given the use-case is for more complex workflows and a way to get more $$$ out of the likes of me.

Edit: I think step 1 - map the existing three buttons of Links, Tags, Comments to a sidebar then step 2 - look into the idea of a card/space explorer in the sidebar that allows you to get an additional pivot of the cards/data. This could also allow you to easily move/copy cards and do all sort of things like you listed out.

[pirijan]

A sidebar is a place, but what it looks like this particular design attempts to solve is:

• view all your comments
• view your tags
• view your links

additional points raised later on in this discussion:

• view all three ^ together
• list all cards in the space

is this correct?

What this mockup/discussion doesn’t seem to address:

• what happens to the existing share/user buttons in the top left? (these are far more important than tags/links/comments imo)
• why is a a sidebar more space efficient than a button in the footer? (seems like once opened and/or pinned, both dialogs take basically the same amount of space)

[kordumb]

why is a a sidebar more space efficient than a button in the footer?

It’s not - I haven’t done a great job at getting my thoughts across here… I don’t think footer vs side is really the right way to frame it… There are a few aspects that led me in this direction… for me the left side of the screen is more important than the real estate on the right side. Especially on a smaller screen. I tend to focus on the left side more as I work, but also, you can’t leave these dialog menus pinned open because anything on the far left hand side is permantly blocked with no way to access them through scrolling, only unpinning.

Shown here: there is no way to edit or see these cards on the left hand side while the dialogs are pinned open. However, Kinopio always has margins built in on the right as cards get added, so this wouldn’t be a problem on the right hand side. In fact, through some testing just now, anytime I add a card to the far right of a space, Kinopio adds enough space for 1.5 sidebars (guesstimating here), so that there is always room to ensure nothing is permanently blocked without having to use a bunch of clicks to unpin, click away so it hides itself, get to the card, reopen, and re-pin. This allows you to have the dialog open and ensure you always have access to all cards on a space with a simple scroll, never having to close the dialog.

The first thought after that is maybe why not move these buttons to the bottom right, but I don’t think that’s right either. The bottom right essentially signifies the open space, directing the user to move from top left to bottom right. Having permanent buttons there (whether open or not) would just feel weird, imo, hence the tab idea in the top right to get to these, and leave them open (never worrying about obstructing cards or other buttons).

what happens to the existing share/user buttons in the top left?

Great point, I admit my mockup was done very poorly. I’d have the button to open right below the notification number so the top of the sidebar would stay at that level, never obstructing the user, share, and notification button.

Which that brings up another issue with the current dialog implementation. I can’t keep these pinned open, because they obstruct other things in the bottom left.

So while this…

• view all three ^ together

… is important to me, not only does the current dialog implementation not allow me to do that, it also prevents me from getting to Explore, Live, and Favorites.

I think a big aspect is these dialogs, when pinned open, feel disruptive from accessing a plethora of other things. Essentially, you can only do one or the other.

There really is no way to live with these pinned open in their implementation today. I will eventually have to unpin to view/edit the cards on the left (which, in my spaces, are of high importance), or Explore, or Live, or Favorites. The right hand side solves all of these (although I’m probably forgetting/missing something)

And when you throw all of this together, the sidebar tab gives you one click to open, one click to close (if it’s possible to have these share real estate and remember the state of each…). Pinning requires two clicks to open, two clicks to close. In the grand scheme of things its minimal, but for something I truly want to be ever-present, but have to continually close to be able to access other things, it adds up and starts to feel tedious.

These mockups probably do a better job showing how it can live in harmony with the current top right menu…

If we look from the point of view of a pretty fresh space, the Tags dialog pinned open obstructs cards on the left side, and there is open pasture on the right hand side. You might think that’s fine, you are done with the left hand side and should be working towards the right anyways. And while that’s true, I still want visibility to those cards, and there is sooo much open space to the right that I could simply scroll a fraction to allow myself to continue working. Essentially, it’s not so much the size or type of the dialog that matters, but the location (although I think the tabbed sidebar idea makes it possible in less clicks).

[pirijan]

OIC that totally makes sense. What if pinning a dialog pins it to the right of the page instead of the left?

[kordumb]

It would definitely be more useful for me, but maybe a bit awkward and unexpected to have things bounce around like that for people?

[kordumb]

One difference between a tool like Logseq and Org-roam is that with Logseq, connections just appear and are easy to spot. It makes serendipitous discovery more likely. With Org-roam it feels like I need to go looking for connections. If I need to go looking, the tool is less useful.

Related to the feelings I’ve been trying to get across here. It’s the difference of a link/tag being presented to you vs having to go looking for them.

Source: https://baty.net/daily/2022/2022-05-10/

[pirijan]

i’m not sure how putting things inside a toggle-able sidebar is different than a similar looking ‘tags’ button. in both cases you click a button to see a similarly formatted list of tags (or links etc.).

Are you referring to the idea that you can see all of these (tags/links/comments) together?

[kordumb]

So I don’t know that I’m saying anything new there… just appreciated the way he framed it.

I think the key is being able to have links and/or tags always open without obstructing or preventing you from doing anything else. I think the main point is, when this data is always available, it can lead you to places you wouldn’t necessarily think to go. The fact you have to click “Links” or “Tags” eliminates that because the only time you’d do that is when you are looking for something specific.

How that’s implemented doesn’t really matter to me. The sidebar was just the first idea/solution I could think of.

I would still appreciate being able to have a Links dialog and Tags dialog open at the same time though. And lastly, thinking about a potential Tag Space, an ever-present Tag dialog that’s already opened to that specific tag.
To summarize that a bit, being able to see all Links to a space, all instances of the tag associated to that space, and a list of tags used in the space, all at once (while not obstructing other UI components).

[pirijan]

I have some promising ways to do this but it’s a ~1week project to do it right, so I’ll have to find the time for it

[pirijan]

how important is it that you can view tags and links at the same time, vs clicking to toggle just tags or just links separately. This combination thing is the biggest ui blocker/challenge here, on small screens something like this becomes unusable or requires much fiddling to become usable.

What if the segmented button choices included counts you could see without having to click in (eg “tags(5) | links(10) | comments(3)”)?