Redesign of tiddlywiki.com - TAKE 1

This is an open thread for anyone to express ideas about a how tiddlywiki.com should be redesigned. This is a recurring topic that otherwise easily hijacks other discussions. It is also a topic that engages many but where much of the same ideas are repeated (year after year!) This phenomenon is partly due to the forum design (same with the google group) which does not provide the structure needed for complex discussions involving many people.

This post and the outlined concept below can be viewed as an experiment to see if we can handle a more structured approach to discuss tiddlywiki.com. Either it works… or we continue to blurt out random pies in the skies.

The title of this thread
The title, especially the distinct “TAKE n” suffix is important. The number is there to indicate progression in an otherwise all-over-the-place discussion. If “landing page discussions” stick with the format <topic> TAKE n, then we will have a clear chronological record which should steer participants to where relevant ideas are discussed instead of old/dismissed ones. The idea is that “TAKE 2” can be started whenever, and whyever, anyone feels it is justified. (An option could be to use the optional tags feature in the editor. Is that better?)

Ideally, eventual TAKE’s will center around actual mockups instead of loose ideas. Then the “TAKE n” labels will be even more useful for references (e.g “that conflicts with what we all agreed on in take 5 so leave it…” or “the take7 color scheme is better because…”)

So, regardless if you have anything to post on this matter right now or later, this somewhat official bucket makes it easier for people to find your ideas later on and build upon them.

Premises
A necessary starting point for any discussion on this and, even more so, for any actual mockup work on the matter, is to consider Jeremys purpose with tiddlywiki .com:

7 Likes

@jeremyruston - -some further questions about boundaries for anyone who is pondering over landing page redesigns.

  1. Must the landing page be a part of a TW?
  2. Must tiddlywiki .com show/be one single TW?
  3. May images be included? Hero? Carousels?
  4. Restrictions on custom stylesheets and macros for the front?
  5. External links?
  6. May any official plugin be installed? (A few specific examples that come to mind are Markdown, KaTeX, InnerWiki)
  7. Cookies? For example, as an experienced user I might want to land directly on the/a docs page and not the prospective-users page. (Maybe there are non-cookie solutions this?)
  8. “Tracking” - e.g sense what system so to propose specific savers?

I’m guessing Jeremy is busy with the upgrade release so fully understand if this is left unanswered until after. Anyone is of course welcome express opinions on these matters (…but anyone making actual mockups had better stick to Jeremys guides.)

This is a comment. Neither a critique nor anything directly helpful :frowning: - Just a thought point.

I find tiddlywiki.com an amazing achievement!

But, in terms of “markets”, it may be an achievement too far? :upside_down_face:
What I mean is that @jeremyruston aimed to satisfy most of the people most of the time; and achieved that!

For me the question is really about WHO (of potential users) would be good to aim for?
BUT only IF there is such a idea that one type of user deserves special first attention (pretty much a norm in software “sales”).

Just comments, TT

OK, so that is a request for clarification of who are the “prospective users” Jeremy refers to in his bullets here above. Reasonable question IMO.

1 Like

We have seen, that a “complete redesign” of tiddlywiki.com will not happen. As Jeremy points out with the 4 points mentioned in the OT.

I did post at a GitHub discussion

I think we can make HelloThere look like other landing pages and let it be the only tiddler that is shown. I think that can be a compromise.

The response from Jeremy was:

I think we can make HelloThere look like other landing pages and let it be the only tiddler that is shown. I think that can be a compromise.

I agree that seems like a promising approach.


It should be straight forward to create a new layout for HelloThere, since it is “only” 1 tiddler. There is no need to completely redesign the UI at tiddlywiki.com

If HelloThere needs some more tiddlers in the same style, it would be possible to link them from HelloThere and open them as standard tiddlers.

I think that would be an easy start and can give us room for some experiments without the need to develop something that needs months, just to find out that it will never be used.

Creating 1 to 10 tiddlers isn’t that big of a problem. … Creating a nice and consistent visual language for 1 to 10 tiddler is a bit of a problem :wink:

Exactly that!

But there Is something in this discussion missing!
What are the implications for marketing that TW Is not one product but several?

I am basically sceptical our marketing should be one track.

I don’t want to spoil your points. I just think a single track presentation of TW Is a mistake.

Just a comment, TT

OK, so here’s a conceptual outline for a landing page, picked up from this article which I learnt about from this nice youtube video

The dotted line is the fold. Here’s what it means:

  1. Explain the value you provide (title)
  2. Explain how you’ll create it (subtitle)
  3. Let the user visualise it (visual)
  4. Make it believable (social proof)
  5. Make taking the next step easy (CTA)
  6. Make the value concrete (features and objections)
  7. Inspire action (social proof)
  8. Tie up loose ends (FAQ)
  9. Repeat your call to action (2nd CTA)
  10. Make yourself memorable (Founder’s note)

(Again, details are explained in the above linked article or the video.)

IMO, the relevant question here is not if it is the holy grail but if it would be an improvement over current page!?

So, before anyone puts in a lot of work that is immediately dismissed - because as soon as I bring out my drawing software, which I’ve done several times for these matters and it always takes a lot of work - @jeremyruston : Is the above outline OK? Obviously, we would need additional links and features, but do you agree to include the above? Nobody else is qualified to answer this and it is a high level question to set a direction.

2 Likes

I agree with re-factoring HelloThere. I think if that’s the “pitch”, it would benefit from an update to the copy (as in the specific words used to sell the user on the product). Whether or not the copy uses your 10 poi t outline or not, it would benefit from adding different user stories / testimonials that might draw potential users in.

I very much agree.

The site is an astonishing resource, especially as it “instances itself” at a serious scale. That is rare!

But I do think that new users coming need to be able to “connect” more easily to how to get what they need for their purposes.

Just a comment, TT

Hi all!

1. Image

1.1 Image 1

1.2. Image 2

1.3 Image 3

2. Themes in Behance/uplabs/dribble/muzli “codebase”

  1. [Theme Tiddywiki]: Wikipedia - Redesign Concept Maud Rochel
  2. [Theme TIddywiki]: Wikipedia - ReDesign Starting Page - Benedict_Plachta
  3. [Theme TIddywiki]: Wikipedia Redesign - Dark Ahmed Badran
3. References
  1. Behance
  2. https://groups.google.com/g/tiddlywiki/c/gX0o8j7Coa8
  3. Behance
  4. Wikipedia - Redesign Concept by Maud Rochel on Dribbble
  5. https://groups.google.com/g/tiddlywiki/c/X2aYVfca1fs
  6. [tw5] Re: Redesign of TiddlyWiki
  7. [tw5] Re: Redesign of TiddlyWiki
  8. Behance
  9. Behance
  10. Behance
  11. Behance
  12. Wikipedia - Redesign Concept by Maud Rochel on Dribbble
  13. Wikipedia Redesign Concept by Divyarajsinh Jhala on Dribbble
  14. Behance
  15. Wikipedia redesign for web | Search by Muzli
  16. Browse thousands of Wikipedia Redesign images for design inspiration | Dribbble
  17. Wikipedia Redesign Challenge - UpLabs | Search by Muzli
  18. Wikipedia Redesign on Behance | Search by Muzli
  19. Wikipedia Redesign | Search by Muzli
  20. Wikipedia Redesign Challenge - UpLabs | Search by Muzli
  21. Wikipedia Redesign Concept - UpLabs
9 Likes

Can I be a Philosopher for a moment?

One of the things about TW is that it is an “ioi” (“Instance of Itself”) … meaning that the way we present it IS already it. That is actually more radical than it might first seem.

I learned this stuff the hard way trying to figure out, with Gene, how to market Gene Gendlin’s application of Focusing–a radical and, now, very active technique in humanistic psychotherapy.

The issue was that, like TW, you could do ANYTHING with it.

That creates the problem. So big in scope & function the whole gets too vast.

My general tentative thought is modest: promote TW for defined markets???

I think it is a mistake to try promote everything at once in one big inclusive TW.
I mean tiddlywiki.com IS amazing!
But I kinda think it would do better if we had a bunch of sites too that each address a use case???

Just thoughts, TT

2 Likes

It is also possible to use page layouts to create a landing page in one layout. And having a button to switch the layout back to the normal tiddlywiki layout. This way you can combine the documentation with a landingpage that is build for promotion in the same url/site.

The mockup Eduardo made is a great example!

1 Like

@Odin @TiddlyTweeter Hi all! I’m thinking about creating a tiddlywiki theme/layout/redesign - choose and vote and I’ll publish later

2 Likes

Love the designs, simple and beautiful.

2 Likes

@eduardo.caiojoao30 - great stuff. A detail I like is the idea of distinguishing different sections by different background colors.

@Odin - we could probably do it so that IFF the landing page is active (whatever “landing page” means, i.e one or several tids), then a special stylesheet is active and if the user proceeds from the landing page then it has normal layout.

1 Like

@twMat thank you for feeback ;D

Wow! Thank you @eduardo.caiojoao30, that first mockup is terrific, and shows great skill and good taste.

In terms of a new theme, I’d really like to introduce a new core theme/layout to replace Snow White/Vanilla. At first we’d offer it as an alternative but the plan would be to make the new theme the default in a future version.

As well as modernising the look and feel, one of the goals would be to make the core styles better encapsulated and easier to override.

7 Likes

Just a reminder that anyone with a website can create a pre-landiing html page for tiddlywiki.com on their site. It is not necessary to do that on tiddlywiki.com, though that would also be ideal.

So I could have a tiddlywiki.giffmex.org that I or anyone can link to and send people to, that contains what I think ought to be on a TW landing page. Anyone else could do the same.

1 Like

I also love your approach!
Absolutely amazing!

I see Jeremy also interested, so go ahead!

Thank you Jeremy! Please do this. I believe while Tiddlywiki is such a powerful tool, but its dress is quite old :wink: We need a new face!

The first mockup of @eduardo.caiojoao30 is wonderful and it would be just great to be made real!

5 Likes