New tailwind-based joinlemmy-site

[dessalines]

You can test this at http://jointest.lemmy.ml:1234/

TODOs yet:

• Update pictures
• Alter specific texts to allow emphasis (make sure you're using interpolation correctly, and if possible get rid of the <T component)
• Add donation links for apps and instances.
• Add a funding drive type box to the support page.
• Categories, and popup instance onboarding
• Add 3 other major UIs linked here
• Update donors

[SorteKanin]

Hey, super glad to hear the joinlemmy site is being worked on. I think there's a lot of room for improvements. I'm not really a frontend guy on the technical side, but I'd love to help with changing some of the phrasing or "style" of presenting Lemmy (currently I think it is way too technical, for one thing).

What's the "guiding principles"/primary motivation in this rework? Is this primarily a change of the visual design or is changing the content also included? I personally think it would make sense to do a complete makeover while we're at it anyway.

Have you considered including a server covenant similar to (not necessarily equal to) Mastodon's and requiring it for an instance to appear on the instance list? Better server sorting/filtering would also be great.

[Nutomic]

@SorteKanin This is only changing the design while keeping current texts, we want to change them later. If you want to help with that, feel free to make commits to the joinlemmy-translations repo.

A server covenant would be an entirely different matter. Personally Id rather not do that, because it means a lot of extra work to verify that instances follow it.

[dessalines]

Is this primarily a change of the visual design or is changing the content also included? I personally think it would make sense to do a complete makeover while we're at it anyway.

Yes this is mainly a visual layout design, not altering the language. The other things you could open up as separate issues.

[SorteKanin]

This is only changing the design while keeping current texts, we want to change them later. If you want to help with that, feel free to make commits to the joinlemmy-translations repo.

Alright, although often the text and design follow each other to some degree. Ideally it should be designed as a whole. I don't mean to compare everything to mastodon (I don't even use mastodon myself), but their equivalent site looks a lot more inviting (and not just because of the artwork).

Personally Id rather not do that, because it means a lot of extra work to verify that instances follow it.

Have you thought about spending some more time on recruiting contributors? Especially people who are not necessarily coders? The work of verifying that servers follow a covenant requires no coding skills, for instance. I can recommend this talk on how to look for non-coding people in open source. A lot of it is just asking and empowering people to do it! This could also include UX design for the join-lemmy site for instance, that also doesn't need coding work (the design itself that is).

Spending more time on recruiting contributors could be a much better use of time on the long term.

[dessalines]

These are larger issues that have nothing to do with this PR. Please open these up as separate issues elsewhere, or they will get lost.

[dessalines]

I also don't feel like the elevator pitch for donating is good enough, why should users care about full time development?, I suggest something like "more full time developers will help us make lemmy the best platform it can be, and attract more awesome content creators". A link to some road map could also be beneficial (donating should become a "conditioned reward".

Sry I didn't address these ones. I agree that line could be tweaked. How about instead of

"Your donations directly support full-time development of the project."

We have

"Your donations will help grow the Lemmy developer co-op, and ensure that we can keep adding new features, and improving Lemmy.

I'm up for other suggestions there tho.

[Die4Ever]

The preview site looks really great! IDK if I should make a separate issue or not, but I would like the ability to hotlink to the "What topic are you most interested in?" questionnaire for choosing an instance to join.

[wiki-me]

Not sure the average joe even knows what a co-op (or a cooperative ) is, so the impression will be at best neutral and not positive , switching co-op for "non profit" is probably better.

Adding new features and improving lemmy feels a little too abstract, maybe adding "user requested" is better:

"Your donations will help grow the Lemmy developer non profit, and ensure that we can keep adding new features users are requesting, and improving Lemmy."

I feel my original purposal was better, but what you and i feel is not really indictive of what the average user will feel, if A/B testing is not an option (but i really think it is worth the effort) i think even just making two posts on lemmy (one asking for options and another asking for people to vote on them) is a better option then what people on github think because it is not a representative sample, the point is not to find what people here think is good, but what will maximize the expected value the donations.

misskey , inkscape , and blender (which seem to do well in term of funding) use the words "awesome" and "support" which feel more meaningful at least to me (but we might turn those words into cliches).

[Nutomic]

Instead of "Join a server" I would rather put "Browse" or "Explore". Basically let people know that they are free to look around and arent required to create an account

This is fixed in the instance list, though the more information window still has "join" buttons.

I had to manually define them as recommended instances unfortunately, but at least everything is well typed. So far I just have domains have an array of languages and topics. But we could add more filters later. The all filters will ignore that explicit list of recommended instances.

There's also the legit concern that perhaps we should only show results that we've explicitly included (in that recommended_instances array), since the crawler might scan pedo stuff like happened before. It might be okay to do that, because people will see that their instance isn't shown on join-lemmy.org, and then realize they need to make a PR to categorize their instance.

Hmm this is tricky. On one hand its not much to ask to make a small file edit to get the instance included. On the other hand there will be many cases where this wont work out in practice, eg unable to access Github for different reasons, not enough tech literacy to figure out the edit steps, language barrier when reading instructions. Also most people will tag their instances as "General", and it wont be easy to figure out when new tags should be added. We could handle this by adding a category setting for Lemmy which can be read over the API. Languages could also be read from /api/v3/site discussion_languages, but in practice there are many instances with all languages active. So I think to make it work with info defined in joinlemmy repo, we will need some community members to manage instance attributes.

Text preview contains unrendered markdown, should only take the actual text

Fixed, I render the markdown rather than try to alter it.

The text preview on /news is still pretty useless as it repeats the title, and then "written by". Might be better to strip out the first few lines of markdown so it starts from the actual text body. But then each one will preview the generic "what is lemmy" block. Maybe get rid of the text preview but then it will look too empty...

On donation page, all the names of donors, contributors, translators should be updated automatically because we will never get around to do it manually. Otherwise get rid of them

This one I really don't want to handle right now. All 3 donation platforms have their own unique API (and some don't even have one), and it'd take a ton of work to get API keys, learn their APIs, create a separate program that writes all these out and integrates them... when it really only takes me ~ 15 minutes (ideally once a month, when I have to update the total counts anyway), to look at the top donors for each.

The translators comes from lemmy-translations/translators.json , which requires a manual PR there, but I don't want to uncredit / remove the section thanking them.

I'd def be willing to get rid of the general sponsors section, because we have > 1k supporters currently, and that'd be way too much to put on the page anyway. I eventually just started to give up when I did this manually. But the sponsors above silver is < 20 ppl.

Hmm so everything on /donate page is manually hardcoded? I was expecting at least the total monthly amount was automatically requested from each platform API so it stays up to date during funding drive. The name list is less important, but I hope you will remember to update it regularly because previously it wasnt updated at all for some years. And yes if general sponsors section is missing hundreds of people, get rid of it for now and we can consider readding once its automated.

Features highlights

I agree these are a bit "dev-oriented", and the images are a bit bland. This is another "sunk cost" thing for me rn tbh, it'd take a lot of work to create new images and rework all that text.

I would leave the texts for now. When launching the new design we can ask the community to help improve the texts and submit better images.

Maybe the physical location of the server/legal entity of the instance could also be taken into account, like Mastodon does?

We could add that to the instance definitions, it'd just be a lot of manual work. Also I'm not sure how to break up regions, which can get infinitely specific, into selectable filters. I'm not against it completely, I just don't know the best way to do that.

You could consider using geoip to find the country where a server is hosted, and then showing the country flag. A bit like the-federation.info. Should be pretty easy to implement but detection will be wrong in some cases.

---

Did the "recommended" section of the instances was removed? This can create a problem of choice overload.

This might not be necessary anymore as there are filters for topic and language which can serve the same purpose. However the language filter is incomplete, feddit.de is missing for German. Portuguese and Portuguese (Brazil) should be merged. Other languages like Chinese or Esperanto have no instances so they should be removed from the dropdown.

You can access all content in the lemmyverse from any server, so it doesn't matter which one you choose.

That's not true, e.g. in lemmy world you can't accesss lemmygrad because it is blocked. this might cause confusion and will make people give up on the platform.

I would suggest "don't worry too much about which server to pick, There are tools for migrating relatively easily to different one".

Its tricky to describe this concisely and accurately. I propose:

Lemmy has many servers which are operated independently, with their own rules, topics and languages. Use the list below to find one that best matches your interests. Thanks to federation you can freely interact with content from other instances, so don't worry too much which one to pick. You can also migrate between servers, or register multiple accounts on different instances to find the one you like most. Read the documentation for more details.

And for donations:

Lemmy is free, open-source software, meaning no advertising, monetizing, or venture capital, ever. However full-time developers are necessary to maintain the project, fix bugs and implement important features. The developers are paid exclusively paid from donations. So please consider donating if you want Lemmy to keep improving. More donations means that more developers can be paid, and improvements can be implemented faster.

Also agree about making a post to get suggestions for these two, and for general improvements to joinlemmy texts. We can do that together with the announcement of the redesign, or right afterwards.

[testman42]

Maybe choose a bit darker shade of green for the buttons, so that the white text on them can be read more easily.

[wiki-me]

This might not be necessary anymore as there are filters for topic and language which can serve the same purpose. However the language filter is incomplete, feddit.de is missing for German. Portuguese and Portuguese (Brazil) should be merged. Other languages like Chinese or Esperanto have no instances so they should be removed from the dropdown.

I think 95% percent of users will want a generic instance in english, i would be careful about this, when the reddit fiasco happened i constantly read complains about picking an instance.

Lemmy has many servers which are operated independently, with their own rules, topics and languages. Use the list below to find one that best matches your interests. Thanks to federation you can freely interact with content from other instances, so don't worry too much which one to pick. You can also migrate between servers, or register multiple accounts on different instances to find the one you like most. Read the documentation for more details.

I like my suggestion because it is shorter , according to this (see graph) they won't read somwhere about half of what is on that page.

Lemmy is free, open-source software, meaning no advertising, monetizing, or venture capital, ever. However full-time developers are necessary to maintain the project, fix bugs and implement important features. The developers are paid exclusively paid from donations. So please consider donating if you want Lemmy to keep improving. More donations means that more developers can be paid, and improvements can be implemented faster.

the part about "full-time developers are necessary to maintain the project" might get a push back, people complained about wikipedia and the whole "we need donations to survive" when they got a lot of money and that is why now they do community reviews for these types of texts.

Also agree about making a post to get suggestions for these two, and for general improvements to joinlemmy texts. We can do that together with the announcement of the redesign, or right afterwards.

Yeah otherwise we might argue over feelings, all the options suggested here seem fine for a short period (1-2 weeks), and this PR is already pretty big.

[dessalines]

but I would like the ability to hotlink to the "What topic are you most interested in?" questionnaire for choosing an instance to join.

fixed. That button now is a pseudo <a element that will let you click and hold to copy its link.

This is fixed in the instance list, though the more information window still has "join" buttons.

Fixed.

So I think to make it work with info defined in joinlemmy repo, we will need some community members to manage instance attributes.

I think that's the best way to handle this; ask instances to categorize themselves. Otherwise it will be our own curated list.

The text preview on /news is still pretty useless as it repeats the title, and then "written by". Might be better to strip out the first few lines of markdown so it starts from the actual text body. But then each one will preview the generic "what is lemmy" block. Maybe get rid of the text preview but then it will look too empty...

This uses either the title from the markdown file, or if that's missing, the first few lines of markdown. But I've made it start from the 3rd line, which looks a little better.

Hmm so everything on /donate page is manually hardcoded? I was expecting at least the total monthly amount was automatically requested from each platform API so it stays up to date during funding drive. The name list is less important, but I hope you will remember to update it regularly because previously it wasnt updated at all for some years.

Yeah unfortunately, but I'll set a reminder to update this monthly.

And yes if general sponsors section is missing hundreds of people, get rid of it for now and we can consider readding once its automated.

Done. But I don't see myself automating this in the future, because of the large work involved in having to deal with 3 separate APIs.

Feddit.de is defined, but the last crawler run didn't pick it up for some reason. I'll add it to recommended just in case.

[Die4Ever]

yep this is cool http://jointest.lemmy.ml:1234/?showJoinModal=true

definitely gonna be my preferred way to get people on Lemmy, thanks!

[aeharding]

First off, very nice work. This is not just an improvement - it's a great design.

I was wondering, would it makes sense to emphasize signing up vs browsing? (Given most users will probably be using this flow to sign up.)

I know it's just one more click - but looking at Join Mastodon, "create account" is the only action when browsing instances.

(Also as a sidenote: I link to join-lemmy.org in-app from Voyager for users to sign up, and it would be great if the flow was pick instance -> signup vs pick instance -> browse -> signup.)

My proposal below:

[wiki-me]

Am i the only one who feel like the site would look better if the images would be removed? feel free to give a "thumbs up" or "thumbs down" so we could get some indication if that is the common sentiment .

[dessalines]

I was wondering, would it makes sense to emphasize signing up vs browsing? (Given most users will probably be using this flow to sign up.)

Good idea, I've got this added now.

As far as the images, I agree they could be better, but they can be changed / added at a later time. I'd accept submissions as long as they maintain the same aspect ratios.