search

jhipster / generator-jhipster

JHipster is a development platform to quickly generate, develop, & deploy modern web applications & microservice architectures.
https://www.jhipster.tech
Apache License 2.0
21.27k stars 4k forks source link

jhipster.github.io website design update #13595

Open ntorionbearstudio opened 3 years ago

ntorionbearstudio commented 3 years ago
Overview of the feature request

This is concerning https://github.com/jhipster/jhipster.github.io

With @ascelineboullen we propose our contribution to update and refresh jHipster's website design.

In first @ascelineboullen can create wireframes / sketch on Figma to see future design and use it as a support of discussion.

We also propose to use new technologies for website development :

pascalgrimaud commented 3 years ago

A big +1 from me

I think the difficulty part would be:

MarlonLuan commented 3 years ago

If the technology has not yet been defined, I suggest you take a look at the Hugo it is written in go, it's simple, and according to its description it is "The world’s fastest framework for building websites."

pascalgrimaud commented 3 years ago

Cc @jdubois @deepu105 and @jhipster/developers

atomfrede commented 3 years ago

I use hugo for my personal blog and really like it as it also supports asciidoc(tor) as alternative to markdown. Before do anything we should maybe think about how to structure should be eventually. Maybe we also can make the separation between high level (marketing) overview and user documentation more clear.

deepu105 commented 3 years ago

Yes a site revamp is heavily needed and appreciated. Few things to keep in mind (some pointers from my experience doing the last revamp)

  1. We are hosted on GitHub pages that means the site needs to be Jekyll based else things will become much more difficult like having CIs that can build and publish that static content on each commit. I don't think it's a big deal but its additional work to be considered and makes deployment a bit more complex than today
  2. The markdown content needs to remain the same, which means the framework (gatsby, Hugo or whatever should be able to work with existing markdown files)
  3. Our markdown files use front matter for metadata and stuff like url redirect etc, this behaviours need to be retained, last I checked Gatsby and Hugo doesn't support front matter, but things might have changed
  4. There are parts of the site that uses AngularJS like home page, marketplace etc, these need to be migrated, it shouldn't be a big deal IMO
  5. The URL slugs should not change, this is very very important as it affects our SEO (file structure can change as long as URL slug remains the same, with Jekyll its possible with front matter not sure about others)

IMO the best way to approach this would be

  1. Redesign the site CSS first
  2. Move dynamic pages from Angular to React or Vue
  3. Move to new SSG (Gatsby or Hugo or whatever) personally I don't care much for this step as Jekyll is still good for our usecase
PierreBesson commented 3 years ago

Thanks a lot for offering contributions to the design !

Having managed some aspects of the website over the years (docs archive, chinese i18n, microservice docs...). Here are my suggestion for the website:

  1. Support Markdown for documentation pages. The Markdown format is the most simple to maximize ease of contributions so we need to keep it. However this is only for the documentation part, the landing page and some other specific pages could use other formats.
  2. Use a static site generator (no back-end) and host in GitHub pages. On the contrary to Deepu, I would be OK to move away from Jekyll as they are a lot of other tools which are easy to setup with GitHub Action. However we really don't want to have a back-end as we have a lot of traffic from all over the world (really impressive) and don't want to pay for servers or have the website be slow for users located in far away regions.
  3. Support an archive of old versions of the website (like I did for https://www.jhipster.tech/documentation-archive/)
  4. Support multiple languages. As of right now we have english and chinese language website (https://jhipster.tech/cn) but it's not really an optimal setup as the Chinese website is a fork of the English version.
  5. Make the doc pages look more standard. Typical tech doc pages looks like https://docs.readthedocs.io/ or https://docs.gitbook.com/. This is what we should have.

One great "framework" that fit all requirements is https://docusaurus.io/ . It is developed by the React team for their docs so I guess it could be a good base for the new website on top of which could be developed great looking design.

ntorionbearstudio commented 3 years ago

Hello, thanks all for your responses

  1. Yes we will keep markdown files for content. With Next JS there is no problem for that : https://nextjs.org/blog/markdown
  2. Yes it will be only a front-end project, no back-end is needed I think for the website
  3. We will keep current URLs / slugs for all pages for SEO and archived websites
  4. For languages, we will setup an internationalization system with NextJs

For now in first step, I think that we should start by designing the new website with some wireframes and then we'll go back to stack issues

pascalgrimaud commented 3 years ago

For now in first step, I think that we should start by designing the new website with some wireframes and then we'll go back to stack issues

Yes plz, small steps to have quick feedbacks first :)

ntorionbearstudio commented 3 years ago

Hello everyone, with @ascelineboullen we started to think about new pages and links disposition. In first, we think that some generator informations or some tools like Jhipster online generator or JDL Studio are not highlighted enough.

We'll have more time to work on it this month. We'll go back soon with some propositions to discuss with you :)

jdubois commented 3 years ago

Totally agree on that! Thanks a lot for your work on this, we have a ton of visitors (110,000 unique visitors last month) and it’s going to help a lot of people.

deepu105 commented 3 years ago

Thats a great point. i added JDL studio to main menu for now. But agree we need a proper redesign

On Sun, 7 Feb 2021, 7:04 am Julien Dubois, notifications@github.com wrote:

Totally agree on that! Thanks a lot for your work on this, we have a ton of visitors (110,000 unique visitors last month) and it’s going to help a lot of people.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jhipster/generator-jhipster/issues/13595#issuecomment-774608917, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAIOKF2B2SBKWT6TCXBPRWLS5YUOVANCNFSM4WHWN7WA .

github-actions[bot] commented 3 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

atomfrede commented 3 years ago

Keep it open please

github-actions[bot] commented 3 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

atomfrede commented 3 years ago

Keep it open.

mraible commented 3 years ago

I have a contact that's developing a website for us at @oktadev. I could ask them for a quote to redesign our site too. While we're add it, we should fix our vulnerabilities. I tested Snyk's new website scanner and we get an F.

jdubois commented 3 years ago

We could at least have a new CSS, and also a custom one for the generated apps (not sure if that can work across all front-end frameworks). But having a common visual identity would be awesome. Concerning Snyk, as the website is a static website, I wonder how we can have XSS attacks - how are those supposed to work? Anyway, we have money and this is the kind of thing we need to pay for, so yes @mraible if you can get a quote that's very interesting.

ntorionbearstudio commented 3 years ago

Hello @mraible @jdubois, @ascelineboullen is preparing some sketchs for the jHipster website, we'll be able to show you this next week I think. This can be a base for a reflexion about the website reorganization and it will give some ideas about the update of the design

CGarces commented 3 years ago

Concerning Snyk, as the website is a static website, I wonder how we can have XSS attacks - how are those supposed to work?

Google.com gets a "D" on Snyk... just for reference.

ntorionbearstudio commented 3 years ago

@ascelineboullen did a first version of wireframes for the website design update : https://rebrand.ly/jhipster ! There are still some parts in progress, but you can start to send us feedbacks on the reorganization and on the design choices :)

deepu105 commented 3 years ago

Home page looks great. We need to move the sponsor section up though

On Wed, 19 May 2021, 8:30 am ntorionbearstudio, @.***> wrote:

@ascelineboullen https://github.com/ascelineboullen did a first version of wireframes for the website design update : https://rebrand.ly/jhipster ! There are still some parts in progress, but you can start to send us feedbacks on the reorganization and on the design choices :)

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jhipster/generator-jhipster/issues/13595#issuecomment-843786240, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAIOKFZAK4WOWT6VK4DZ7TTTONLHTANCNFSM4WHWN7WA .

mraible commented 3 years ago

@ntorionbearstudio I ❤️ it! It looks fantastic. Do you plan to offer light and dark options?

jdubois commented 3 years ago

Yes @ntorionbearstudio this looks awesome! I especially like the docs, this really needs to be improved.

DanielFran commented 3 years ago

Great @ntorionbearstudio seems awesome

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

pascalgrimaud commented 2 years ago

Still in progress

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

DanielFran commented 2 years ago

Still in progress

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

mraible commented 2 years ago

@dogeared recommended we take a look at livecycle.io:

Livecycle is building this super cool collaboration service where devs and non-devs alike can work on projects. For instance, someone who spots a typo or a sentence that could use some wordsmithing or a section of the site that could use better formatting, but isn't a developer could make a suggestion on a live version of the site. That would then provide instant feedback to someone responsible for making the updates on the github repo. (You can see a video clip of this in action on the https://livecycle.io site).

Maybe it can help us when re-designing our website?

ascelineboullen commented 2 years ago

Thank you @mraible , we will take a look with @ntorionbearstudio ! :)

ascelineboullen commented 2 years ago

Hello ! For your information, I've worked on, this week end. I will update the Figma link this week, when it will be good and ready to take your feedbacks ! :)

pascalgrimaud commented 2 years ago

Thanks @ascelineboullen ! Can't wait :-)

jdubois commented 2 years ago

That's awesome @ascelineboullen ! I'm also eager to see this!

ascelineboullen commented 2 years ago

Hello ! I just updated the Figma link https://rebrand.ly/jhipster. I have to do some more margin / icons and photos adjustments and it will be good, but you can already give your feedback ;). Thanks !

pascalgrimaud commented 2 years ago

Nice work @ascelineboullen : love the new design I have only 1 feedback at the moment: the site needs to be responsive, but I'm pretty sure it will be

MathieuAA commented 2 years ago

That's awesome! Nice job @ascelineboullen!!

deepu105 commented 2 years ago

Excellent work! :clap:

Few small comments:

avdev4j commented 2 years ago

I really like the new logo with the JHipster family and the whole branding. The colors are great,

Maybe I would put sponsors before companies that use JHipster.

Anyway, you find the best solution to release more frequently by cloning Pascal. Good job!

On Mon, Nov 15, 2021 at 4:37 PM Deepu K Sasidharan @.***> wrote:

Excellent work! 👏

Few small comments:

  • I would put teams in a separate page as we have today and keep modules/blueprints at the end of the page like today
  • I think we should retain the quick start section

— You are receiving this because you are on a team that was mentioned. Reply to this email directly, view it on GitHub https://github.com/jhipster/generator-jhipster/issues/13595#issuecomment-969032410, or unsubscribe https://github.com/notifications/unsubscribe-auth/AJAVHFEQAYUVD3WEFBEI42LUMESJ5ANCNFSM4WHWN7WA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

jdubois commented 2 years ago

Yes it looks awesome! I mostly have comments about the content:

wmarques commented 2 years ago

Really like the new design, awesome job 👏

colameo commented 2 years ago

congrats! really cool :-)

mraible commented 2 years ago

This looks fantastic!

A couple typos I noticed:

ascelineboullen commented 2 years ago

Thanks for your feedbacks ! 😀 I will rework on it this week end again to make somes fixs, and apply your differents feedbacks, and I will design a responsive view to show you how it could be on a mobile, yes @pascalgrimaud , no worries !

deepu105 commented 2 years ago

@ascelineboullen can I make a request for the family image. Can you please include more diverse characters from the collection there as there are too many white characters in this and we want a better mix

ascelineboullen commented 2 years ago

@deepu105 , yes we were talking about it with @avdev4j. Actually, I'm still working on the responsive version, but I will do that asap, with the differents fixs needed! ;). I continue!

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

pascalgrimaud commented 2 years ago

work in progress

ascelineboullen commented 2 years ago

Thank you @pascalgrimaud for the message to stop the bot, I missed it! I had COVID and it was a little bit difficult this last weeks... 🙏

For the news: I I have not finished yet but I fixed some issues that you noticed me (illustration for example) and I'm working also on the responsive view. I will do an update soon (Probably this week end)! 😃

pascalgrimaud commented 2 years ago

oh no worry @ascelineboullen Take care of yourself, it's more important than Open Source project.

There is no deadline in Open Source project, so take the time you need, really.