Redesigning Modelina’s website while keeping the UI/UX in mind.

[prajjwalkapoor]

Why do we need this improvement?

The current website of Modelina is not as appealing as Async API's main website. It is not mobile-responsive and does not have all the features and information that users need. The website should be improved to make it more user-friendly and informative. Also, the Docs of Modelina should be integrated with keeping UX in mind.

These are some of the few things that we can improve.

How will this change help?

Redesigning the website will make the information more easily accessible in a visually appealing manner. Also, by integrating the docs directly into the website will reduce the time of searching things on GitHub.

Expected Flow

• Designing the Figma mockups for complete websites (Including Docs)
• Building the UI for the design.
• Integrating the docs.

What is the motivation?

The People and the Product 🙂

[github-actions]

Welcome to AsyncAPI. Thanks a lot for reporting your first issue. Please check out our contributors guide and the instructions about a basic recommended setup useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.

[jonaslagoni]

Definitely could use a design uplift 😆

My only concern is the Figma mockups, and this depends on how far you want to take it, but as long as it's just for your convenience for you to contribute that's perfectly fine 🙂

[prajjwalkapoor]

Definitely could use a design uplift laughing

My only concern is the Figma mockups, and this depends on how far you want to take it, but as long as it's just for your convenience for you to contribute that's perfectly fine slightly_smiling_face

I appreciate your response.
Regarding the Figma mockups, it gives the idea of where the design is heading. Also, it's easier to take feedback with design mockups. If you have any suggestions or specific considerations in mind, I would love to take your input.

[jonaslagoni]

Regarding the Figma mockups, it gives the idea of where the design is heading. Also, it's easier to take feedback with design mockups. If you have any suggestions or specific considerations in mind, I would love to take your input.

It's a nice idea, but not everyone will have Figma, use it, or even know how to use it (me included). So requiring Figma to be updated each time before the website changes will be almost impossible to enforce, or not make any sense IMO.

It sounds perfect for a product team, in the same company, that has the possibility to enforce it, but in open source, not so much.

That's why I am saying that as long as it's not a requirement to change Figma when doing any changes to the website, then it's cool with me 👍

[jonaslagoni]

How does that sound @prajjwalkapoor?

[prajjwalkapoor]

Yeah, @jonaslagoni, it's okay if we proceed that way also. I am starting the work on the website then.

[sambhavgupta0705]

IMO it would be good if we open several issues as then we will be able to divide task and I guess there will be no need of figma also

[kaushik-rishi]

I agree with @sambhavgupta0705 on this.

[prajjwalkapoor]

Nice idea @sambhavgupta0705, we can do this

[jonaslagoni]

Hey folks, any update here? Anything you need help with? 🙂

[Mayaleeeee]

I'll include this in the design issues that @fmvilas, and I are compiling for our new design contributors. I appreciate you bringing it to my attention, @sambhavgupta0705. Thank you!

[Mayaleeeee]

Hi @prajjwalkapoor I'm interested in working on this issue.

[Mayaleeeee]

Please check this out.
Here's the Figma link

[sambhavgupta0705]

Hey @Mayaleeeee @prajjwalkapoor won't be working on this issue.
If @jonaslagoni agrees we can work on this design

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[jonaslagoni]

cc @devilkiller-ag incase you find any of this interesting ✌️

[devilkiller-ag]

Hi, @jonaslagoni This issue seems to be a perfect fit for me. I am interested in working on this. So will we follow the above figma design shared by @Mayaleeeee as a base? Also, can I include issue #1715 in this?

[jonaslagoni]

I would probably split it up into multiple PRs but you have free use to do what you want 😄

[devilkiller-ag]

@jonaslagoni That too seems to be a good option. I will access the website in detail and start working on this my creating multiple PRs. By the way, can this work be eligible for Bounty?

[devilkiller-ag]

@jonaslagoni After carefully comparing the AsyncAPI website and the Modelina website, I think we can divide this work into the following PRs:

1. Redesign Navbar
2. Redesign Hero Section
3. Redesign Usage Section
4. Make Playground Mobile Responsive

Let me know if there is something else that I forgot.

[jonaslagoni]

Sounds good 👍

Feel free to re-organize the issues as you see fit 😄

[devilkiller-ag]

Okay Great, I will start with Navbar!

[Gmin2]

@jonaslagoni After carefully comparing the AsyncAPI website and the Modelina website, I think we can divide this work into the following PRs:

1. Redesign Navbar
2. Redesign Hero Section
3. Redesign Usage Section
4. Make Playground Mobile Responsive

Let me know if there is something else that I forgot.

can i help you make some components here?

cc @jonaslagoni @devilkiller-ag

[devilkiller-ag]

Hi @Min2who Thanks for asking. However, I would like to work on all of these parts. I would appreciate it if you can solve some stale issues.

[devilkiller-ag]

Hey @jonaslagoni, now I will move forward with working on responsive layout of playground.

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[jonaslagoni]

@devilkiller-ag does it make sense to close this issue down and open smaller issues as needed for the website?

[devilkiller-ag]

Hi @jonaslagoni, yes the work on this issue was completed in PR #1732 and #1733. So we can close this issue. However, I feel we can make the hero section styling for the mobile view better. Should I open an issue for this today?

[jonaslagoni]

For sure 🤙

[jonaslagoni]

Closing as completed then ✌️