Guess what everyone, Coracle is getting a redesign! @daniele has put together some πŸ”₯ mockups for me, but before falling down that rabbit hole I wanted to run it by my users and the #nostrdesign community. You can find the Figma below, along with some screenshots as well. The goal for the re-design is to: - Make using Coracle friendlier and more intuitive - Make it look like it wasn't designed by an engineer - Solve some complex UX issues, like custom feeds, nested modals, forms, etc. Some questions I currently have: - Is there too much uppercase text? - Are the menus intuitive? - Is it pretty? Is there anything you hate? https://www.figma.com/file/dr0lpdEvs5536OrRZvjTrL/Coracle

Replies (46)

DireMunchkin's avatar
DireMunchkin 2 years ago
Looks pretty! But I think the sidebars in pic 2 and 3 seem like they take a bit too much space. Maybe if they where narrower, or just one sidebar with a tree?
The idea is to take advantage of the whole viewport, keeping a column not too wide (~70 characters) for the content to have good readability. I had thought of an option to collapse the first sidebar and show it only with icons (which I would like to use elsewhere, too). Thanks for resurrecting this idea! Then, like you can see in the Figma, there is also a "zen mode", where you see only the main content and the menu is dimmed.
@hodlbod I think it’s attractive. I do get the feeling of orange being too strong, color scheme wise? So my first idea was to say add purple, for nostr rep? Then I had a better idea. What if you used both orange AND purple, and purple buttons etc would subliminally signify social content, whilst orange can tie to the ideas or functions pertaining to bitcoin/zaps etc. see what I’m getting at?
It's going to be even amazinger. Static mockups can't do it justice β€” I had reservations at first but even after the few changes I've done in development I'm really happy with the changes!
n's avatar
n 2 years ago
zen modeγ„γ„γ­πŸ§˜πŸ’―
A secondary accent color is undoubtedly useful. Currently, I use a very light brown for less important interactions, maybe it has a little too low contrast, we can test something else. But I agree with @hodlbod, no more purple :)
n's avatar
n 2 years ago
Overall, it is angular and may not feel rounded or warm or tender. I don't know until I use it, but...
Ah, if I may get the words wrong, do forgive me, hmm, the 'X' button & 'double Chevron' button needs more loveπŸ’”, why? Because it is the most used, it was the most helpful to get me "unlost"🧭 I'm so happy that it's getting a facelift & not changing drastically in the way it currently 'pulls up' notes, a very, very strong point of core-cal.Social😘
Its looking very good. I am on the same boat as other comments saying there is too much uppercase text.
Those otherwise very good looking side bars may take too much real estate. Other than that it's looking good.
No purple please. It's an ugly combination, plus if you feel the orange is too strong, you would only make it worse adding purple.
It's the WoT score, already present in Coracle. It's not %, it is "equal to how many people you follow that also follow a given person, minus pow(2, log(n)), where n is how many people you follow who have muted this person. This allows you to see at a glance if someone is accepted in your network. This helps reduce spam, impostors, and objectionable content. You can set a minimum web of trust score on your content settings page, which will automatically mute anyone with a lower score than your threshold." (current tooltip) The half circle is more prominent (orange) to show that the user is followed, dimmed for not followed users. I would like to use the coracle sign, (half)circle, more frequently in the interface.
Niel Liesmons's avatar
Niel Liesmons 2 years ago
Got it. The % was just to make the joke work πŸ˜‰ I personally love how coracle does it now (but I get the C thing too). Started using this idea in my designs too: image
Niel Liesmons's avatar
Niel Liesmons 2 years ago
Actually think this a hugely underestimated UI innovation here. You can completely avoid having to show the NIP-05. Especially when logged in. It really cleans up the UI. I just need to see if a user is in one of my profile lists (Following f.e.) or their WoT score to navigate my way through.
!!!
hodlbod's avatar hodlbod
Guess what everyone, Coracle is getting a redesign! @daniele has put together some πŸ”₯ mockups for me, but before falling down that rabbit hole I wanted to run it by my users and the #nostrdesign community. You can find the Figma below, along with some screenshots as well. The goal for the re-design is to: - Make using Coracle friendlier and more intuitive - Make it look like it wasn't designed by an engineer - Solve some complex UX issues, like custom feeds, nested modals, forms, etc. Some questions I currently have: - Is there too much uppercase text? - Are the menus intuitive? - Is it pretty? Is there anything you hate? https://www.figma.com/file/dr0lpdEvs5536OrRZvjTrL/Coracle
View quoted note →
> The % was just to make the joke work πŸ˜‰ I replied before the morning coffee πŸ˜€
The colors originated almost two years ago when I thought "huh, it would be interesting to design something in brown". Other people have mentioned theming too, I'll look into it.
It looks really good! I like how the posts and menu are designed. Here are some thoughts on a few details: - I'm not sure about having "npub" next to the author's picture in every post. Is it distracting, and does it matter in that spot? - Should the font for the post author's nickname be a bit bigger? It seems a little too small. - The rounded corners on the mobile view look a bit strange. - I prefer the current rounded post button at the bottom. - Is the search bar at the top too distracting?
All great points. I'm told the mobile view will look ok on an actual phone because there won't be as much contrast with the body of the phone. For the rest, I think I might agree.
↑