Request for some feedback

[Ash Rubigo]

Hi,

It'd be great to get some feedback on on the aesthetic, layout, and navigability of my wiki http://www.ashrubigo.com/. The content itself is very work-in-progress, so don't pay much attention to that.

I tried to make the CSS very consistent, minimal, and dark, because the wiki will have a lot of media on it eventually. http://www.ashrubigo.com/#manual--nodius for a page with lot's of pictures.

I'm thinking it's not very palatable for mainstream audiences, not really sure what it needs though.

Thanks!

[TW Tones]

Ash,

I am not an aesthetic champion, but it is interesting to me. However your annotation [*] to me, seems to be designed to indicate an exception, however it appears to be the rule. Is this making it more complex than need be?, even although it looks OK.

• I suppose the main criteria to drive such a design is who is the main audience? and on what devices.
• I was reading the page in a bright room, and in this case I would like more contrast.
• I love being able to zoom in and out with tiddlywiki, so I can re-frame and scale according to content.
• Have you limited the width of tiddlers?

Regards

Tony

[Ash Rubigo]

Thanks for the response!

Yes the [*] indicates an internal link, [external] is an external link, and [missing] is a missing link. The reason all links have at least [*] is because if there are several in a row it's easier to separate them at a glance, without hovering over them all, though I admit this is unconventional. I think of it like numerical reference similar to Wikipedia, except no need for numbers. I have removed them for now.

I can certainly increase the contrast. Would you want more with respect to the text, or borders, or both? I tweaked both, tell me what you think

I have limited the width. I find it improves readability, shorter lines means finding the start of the next is easier. I'm not sure what you mean by "re-frame". You can still zoom in and out with the browser if that's what you mean?

Regards,

Ash

[Birthe C]

Hi Ash,

Interesting. I wonder what are the unreadable signs? [unreadable nonsense]

I think my not being able to read it has to do with my settings, but if I cannot read it, I think it might be so for other people also.

Birthe

[Ash Rubigo]

Tony,

I forgot to mention, the plan is for the site to be the hub of a progress blog, wiki, and episodes of a multimedia series called Exodium, but also the projects it depends on, including Fantasci, Nodius Base, and Nodius. The audience will be adults of all ages of all backgrounds, so the style needs to be very broadly appealing, which is part of the reason it's so plain.

Regards,

Ash

On Tuesday, 30 June 2020 02:21:06 UTC+1, TW Tones wrote:

[Ash Rubigo]

Hi Birthe,

Can you post a screenshots and which browser and device you are using? I haven't bumped into that using Firefox or Chrome.

Ash

[Ash Rubigo]

Never mind, I fixed it. There was a symbol mobile devices couldn't read. Thanks for catching that!

Ash

[Birthe C]

Ash,

I used laptop with Linux Mint and Firefox. But it looks nice after your fix,

I wonder if you really  need the reader seeing all that tabs. Try to look at http://publicsidebar.tiddlyspot.com/

 you decide exactly what to see, but are still able to easily edit, when you want it. I have used that quite a lot.

Birthe

[TW Tones]

Ash,

I think it looks a lot better, and certanly closing the side bar and Zooming I find it easier to use.

Regards

TW Tony

[Ash Rubigo]

Birthe,

That's a great recommendation, I'll definitely use that!

Ash

[Ash Rubigo]

Tony, is that to say you like the wiki as it is, or would you prefer the max-width of the tiddlers to be removed?

Birthe, I removed some of the tabs in the sidebar. Instead of using http://publicsidebar.tiddlyspot.com/, I just altered my publish '.bat' script. The $:/tags/SideBar tag controls whether a tiddler appears in the sidebar, so in the script I just delete it for the tab shadow tiddlers I didn't want to appear.

Ash

[TW Tones]

Ash

As is is fine and I like to zoom in.

Just personal

Regards
Tony

[Birthe C]

Ash,

I understand, when I used the public sidebar, I also changed it around, so that I could use it from one and the same tiddlyspot ;-), just using a well hidden button.

Your wiki look so much better and clearer now. I like it.

Birthe

[Mat]

Ash Rubigo wrote:

It'd be great to get some feedback on on the aesthetic, layout, and navigability of my wiki http://www.ashrubigo.com/.

• Am I the only one who doesn't get any scrolling when clicking the links? (win/chrome)
• I'm on desktop: It says "Show/hide sidebar" but it not obvious that the whole upper part of the page, which is actually the whole default viewport, is what is referred to.
• The first default tiddler is... unclear; why is the title (if it is the title?) in brackets? Or maybe the big blue is the title? But there seem to be tag pills under both? 
• If it is a public site, you should probably remove most of the tiddler tool button showing only the close button (X) and page tools.
• Blue fine links on black... IMO not good for visibility.
  
• Aesthetics: I understand the darkness is intentional but you do ask for feedback so I'll just mention that I don't like these dark themes other than as "night" themes. Just my opinion.

<:-)

[Ash Rubigo]

Mat,

These are some really useful points, thanks!

• Am I the only one who doesn't get any scrolling when clicking the links? (win/chrome)

 What exactly do you mean by no scrolling?

• I'm on desktop: It says "Show/hide sidebar" but it not obvious that the whole upper part of the page, which is actually the whole default viewport, is what is referred to.

Yeah that's a good point. I don't really like the way the default theme handles the sidebar when it changes to the 'mobile' layout personally. I'd rather it cover the content instead of move to the top of the page. To fix it I'd have to install a better theme, then override the CSS again, or make my own theme entirely, which is something I am thinking of doing.

• The first default tiddler is... unclear; why is the title (if it is the title?) in brackets? Or maybe the big blue is the title? But there seem to be tag pills under both? 

I agree there shouldn't be 2 titles, so I've fixed that. I've changed the buttons to be more distinguishable from tags.

• If it is a public site, you should probably remove most of the tiddler tool button showing only the close button (X) and page tools.

Maybe, but then I find when I'm browsing other people's tiddlywiki's I like to look at the source of each page. I'll consider removing some of those buttons.

• Blue fine links on black... IMO not good for visibility.
  

 I've made the links brighter, I can go even further if needed.

• Aesthetics: I understand the darkness is intentional but you do ask for feedback so I'll just mention that I don't like these dark themes other than as "night" themes. Just my opinion.

Yeah, some people certainly don't like them. I could add a switch, because I do have a light theme ready to go as well, not really sure how I would do that though. I chose the dark theme because there will be pictures and videos, and I think dark is much less distracting to that kind of content than light is, especially in a dark room.

Ash

[Mat]

Ash Rubigo wrote:

• Am I the only one who doesn't get any scrolling when clicking the links? (win/chrome)

 What exactly do you mean by no scrolling?

Literally that. I click a link, and seemingly nothing happens other than that my scrollbar handle lengthens or shortens, i.e the tiddler is opened but there is no navigation to it. I tried it now also on my android phone and same result - no scrolling to display the actual tiddler.

BTW, I assume it is intentional that the page shows as if on mobile/smallscreen also for laptop 14" screen.

<:-)

[Ash Rubigo]

Mat,

Literally that. I click a link, and seemingly nothing happens other than that my scrollbar handle lengthens or shortens, i.e the tiddler is opened but there is no navigation to it. I tried it now also on my android phone and same result - no scrolling to display the actual tiddler.

So I take it the sidebar is at the top of the screen for you. So if you click a link on the sidebar, the sidebar itself won't change, but if you scroll down the active tiddler should have changed. This is working for me on desktop and mobile, Chrome and Firefox.

If that isn't the case for you, then I'd struggle to visualise what precisely is happening. A screen capture of the problem would be great in finding out what's wrong.

BTW, I assume it is intentional that the page shows as if on mobile/smallscreen also for laptop 14" screen.

Yes it is. I want the text to be nice and large for readability, which means that even non-mobile screens can be considered 'small', as far as the interface is concerned. The only difference is where the sidebar is, and like I said earlier, I would prefer it stayed a sidebar and overlapped the content. Something for me to work on.

Thanks!

Ash

[Mat]

Ash Rubigo wrote:

So I take it the sidebar is at the top of the screen for you. So if you click a link on the sidebar, the sidebar itself won't change, but if you scroll down the active tiddler should have changed. This is working for me on desktop and mobile, Chrome and Firefox.

Yes, if I manually scroll down the tiddler has changed, yes. But is it OK to expect the user to have to manually scroll down in order to see the tiddler whose title link he clicked, rather than having the system automatically scroll to it?

<:-)

[Ash Rubigo]

Ah okay, that makes things clearer. Yeah, that's just default TiddlyWiki behaviour. I completely agree the mobile version of the sidebar needs work, and I think I'll make it a priority, it's just confusing and awkward as is. Like I said before, changing it so it instead overlaps the content makes more sense to me, which averts all the problems. I don't think it's a simple fix though, because to my understanding it involves some JavaScript. I'll have to look at downloading a theme, then reworking it to my liking.

I think the wiki is looking a bit sharper than it was. I'm definitely still open to more feedback, as it can always be better. Thanks to everyone for the responses so far!

Ash

[Mat]

Ash Rubigo wrote:

Ah okay, that makes things clearer. Yeah, that's just default TiddlyWiki behaviour.

No, that's not default TW behaviour: If I go to tiddlywiki.com on my android phone and click any of the sidebar links, then there's automatic scroll to that tiddler.

<:-)

[Ash Rubigo]

Huh, you're right, I have no idea how I've broken that. That's strange.

I realised making the sidebar always a sidebar was easier than I thought. Tell me what you think!

Ash

[Mat]

Ash Rubigo wrote:

I realised making the sidebar always a sidebar was easier than I thought. Tell me what you think!

I guess it depends on your target audience. You indicated, apropos possibly keeping the tiddler tool buttons, that your audience is other TW users in which case a sidebar like that is probably OK. The first thing a fellow tiddleur would think is probably "OK, the sidebar is open" and think no further of it. But someone not initiated will probably find it confusing, at least on desktop. I mean, an intrusive sidebar is probably closed by default usually... If there are critical links that the user needs to see directly when visiting the site perhaps they should be in the topmost tiddler also? Just an idea, possibly a bad one ;-)

In the open sidebar there is, on my desktop screen, a horizontal scrollbar at bottom. But the sidebar shows fully and there is no scroll handle. My guess is you have something inside the popout that exceeds it by just a pixel or so, e.g a border.

<:-)

[Ash Rubigo]

You indicated that your audience is other TW users

 

Actually I aim to have a large amount of traffic from all over the Internet, primarily Reddit. This wiki is the hub for the projects I work on, which is why I'm trying refine the style before promoting it to the general public. Reddit in particular can be brutal with their feedback, they are going to absolutely tear it apart. It is a wiki, a format that isn't necessarily the most appealing, but I'm not under the illusion it will be the place everyone goes. Unlike independent posts, the great thing about a wiki is that all the content can reference each other using links, which is great for fans wanting to delve deeper. I suspect only images and videos can be truly mainstream, which is what I aim to share directly, and that is what the wiki needs a lot of, pictures pictures pictures.

I mean, an intrusive sidebar is probably closed by default usually... If there are critical links that the user needs to see directly when visiting the site perhaps they should be in the topmost tiddler also? Just an idea, possibly a bad one ;-)

 

Yeah, I agree that it should probably be closed by default. Just a matter of remembering to save with the sidebar closed. Fixed.

My philosophy is already that all pages should be reachable by following links from the index, plus there is a persistent button with text for the sidebar, so I think people shouldn't have much of a problem finding the sidebar.

In the open sidebar there is, on my desktop screen, a horizontal scrollbar at bottom. But the sidebar shows fully and there is no scroll handle. My guess is you have something inside the popout that exceeds it by just a pixel or so, e.g a border.

Oh, I didn't notice that before, fixed, thanks!

Ash

[Ash Rubigo]

Mat,

I found out why clicking a link does not move the screen to the top of the tiddler. The problem is it does not work with the 'Zoomin' story view, because in $:/core/modules/storyviews/zoomin.js, line 115 is commented out:

//    $tw.pageScroller.scrollIntoView(targetElement);

Uncommenting it brings back the behavious, but of course it requires overwriting a shadow tiddler, which is not so bad. I will note though, that this is a bit buggy. I don't know why yet, but this doesn't work when revisiting some pages that are already open. 

Fixed?

Ash

[Mat]

@Ash

I posted a bug report referencing this thread: https://github.com/Jermolene/TiddlyWiki5/issues/4744

Fixed?

IMO it doesn't seem fixed. For example if you, on your default, page manually scroll down to access the "3. Project" link, and click it, you'll note that you do get that tiddler... but you're still scrolled down on the page.

<:-)

[Ash Rubigo]

Mat,

Thank you for posting a bug report!

I would certainly think that usually, when clicking a link to a tiddler, people would want to be taken to the top of it. For that reason alone I agree, and consider even that line being commented out a bug. I could maybe excuse it if it returned you to your previous scroll position for tiddlers that are already open, but that would possibly be confusing.

I think this will end up fixing a lot of the issues with the 'Zoomin' view: https://github.com/Jermolene/TiddlyWiki5/pull/3412.

Ash