Enhance UI of Hero page

[LakshmiKala040]

The current UI of the Hero Page is clean and functional but lacks a human-centered design touch. It appears more like it was auto-generated by AI tools, resulting in a layout that may feel generic or impersonal to users.

Suggestions for Improvement

• Add some graphics or custom illustrations
• Consider adding testimonials, product screenshots, or real-world use cases to humanize the page.

[PrithvijitBose]

Hey @LakshmiKala040

I came across the issue you raised regarding the hero section's current UI lacking a human-centered design approach, and I'm very interested in taking on this challenge.
I completely agree with your assessment that the current hero section, while functional, feels somewhat generic and could benefit from a more personalized, engaging user experience. Your suggestions about adding graphics, testimonials, and real-world use cases are spot-on for creating that human connection.

Phase 1: Research & Discovery

• Conduct user behaviour analysis on the current hero section
• Gather user feedback
• Technical audit of current implementation and performance metrics

Phase 2: Strategy & Content Planning

• Plan integration of testimonials, use cases, and interactive elements
• Create visual direction and design system guidelines

Phase 3: Design & Prototyping

• Create multiple wireframe concepts focusing on human-centered design
• Develop custom illustrations showing diverse perspectives
• Build interactive prototypes for user testing

Phase 4: Development & Implementation

• Implement responsive, accessible component architecture
• Add micro-animations and interactive elements
• Integrate real testimonials and use case examples

Phase 5: Testing & Iteration

• Conduct usability testing with target users
• Discuss with mentors and ask for their takes
• Iterate based on data and feedback

Before I begin, I'd love to get your insights:

1. Are there any specific user research findings or feedback you've already collected that I should be aware of?
2. Do you have particular examples of hero sections from other products that you feel successfully achieve that "human touch"?
3. Are there any technical constraints, brand guidelines, or existing design systems I should work within?
4. What would you consider the primary success metrics for this redesign?

[ParagGhatage]

Hey @LakshmiKala040

I came across the issue you raised regarding the hero section's current UI lacking a human-centered design approach, and I'm very interested in taking on this challenge. I completely agree with your assessment that the current hero section, while functional, feels somewhat generic and could benefit from a more personalized, engaging user experience. Your suggestions about adding graphics, testimonials, and real-world use cases are spot-on for creating that human connection.

Phase 1: Research & Discovery

• Conduct user behaviour analysis on the current hero section
• Gather user feedback
• Technical audit of current implementation and performance metrics

Phase 2: Strategy & Content Planning

• Plan integration of testimonials, use cases, and interactive elements
• Create visual direction and design system guidelines

Phase 3: Design & Prototyping

• Create multiple wireframe concepts focusing on human-centered design
• Develop custom illustrations showing diverse perspectives
• Build interactive prototypes for user testing

Phase 4: Development & Implementation

• Implement responsive, accessible component architecture
• Add micro-animations and interactive elements
• Integrate real testimonials and use case examples

Phase 5: Testing & Iteration

• Conduct usability testing with target users
• Discuss with mentors and ask for their takes
• Iterate based on data and feedback

Before I begin, I'd love to get your insights:

1. Are there any specific user research findings or feedback you've already collected that I should be aware of?
2. Do you have particular examples of hero sections from other products that you feel successfully achieve that "human touch"?
3. Are there any technical constraints, brand guidelines, or existing design systems I should work within?
4. What would you consider the primary success metrics for this redesign?

Hey @PrithvijitBose ,
Its great to see your enthusiasm for the new design.
If you want to implement new-design, go ahead .
redesign the pages and submit the PR.
If its good and correct according to the project structure, I will merge it.

[ParagGhatage]

The current UI of the Hero Page is clean and functional but lacks a human-centered design touch. It appears more like it was auto-generated by AI tools, resulting in a layout that may feel generic or impersonal to users.

Suggestions for Improvement

• Add some graphics or custom illustrations
• Consider adding testimonials, product screenshots, or real-world use cases to humanize the page.

Hi @LakshmiKala040 ,
Thanks for identifying this issue.
If you have some ideas to make Perspective more User friendly, go ahead and implement your ideas, Make a well structured PR.
I will review it.
Thanks!

[Mrunu2122]

Hii @ParagGhatage , I came across this issue about making the Hero Page feel more human-centered and saw some good suggestions earlier. Since there haven’t been any updates in the last two weeks, I wanted to check if this is still open and if nobody has started working on it yet.

I’d love to pick this up! I’ve done a few frontend redesigns before, focusing on making pages more engaging and relatable for users. My plan is to add some custom illustrations or graphics, showcase real product screenshots, and include testimonials or use cases to give the page more personality and connection.

Here’s a rough outline of what I’m thinking for the redesign:

Refresh the hero section layout with a clearer hierarchy and eye-catching visuals

Add custom graphics or simple illustrations that show what the project is about

Show real product screenshots in a cool way, maybe with carousel or device frames

Include short testimonials from users or contributors to build trust

Add real-world examples of how people use Perspective AI, with icons to make it easy to scan

Make the main call-to-action more bold and add a secondary “Learn More” link

Use soft background shapes or gradients to avoid a flat, auto-generated look, keeping colors on brand

If you want, I can even put together a quick visual wireframe mockup to show the idea before jumping into the code....

that usually helps speed things up.

I’m attaching some screenshots of similar UI work I’ve done to give you a feel for my style and approach.

Please let me know if it’s okay to start working on this!

Looking forward to contributing :)

[anurag-sinha04]

Hi! I’m interested in working on this issue. I plan to fix the UI bug and improve responsiveness. Will also ensure the code remains clean and maintainable.
My idea and plan is ready and after completion will send a PR....
Could you please assign this issue to me?

[ParagGhatage]

Hii @ParagGhatage , I came across this issue about making the Hero Page feel more human-centered and saw some good suggestions earlier. Since there haven’t been any updates in the last two weeks, I wanted to check if this is still open and if nobody has started working on it yet.

I’d love to pick this up! I’ve done a few frontend redesigns before, focusing on making pages more engaging and relatable for users. My plan is to add some custom illustrations or graphics, showcase real product screenshots, and include testimonials or use cases to give the page more personality and connection.

Here’s a rough outline of what I’m thinking for the redesign:

Refresh the hero section layout with a clearer hierarchy and eye-catching visuals

Add custom graphics or simple illustrations that show what the project is about

Show real product screenshots in a cool way, maybe with carousel or device frames

Include short testimonials from users or contributors to build trust

Add real-world examples of how people use Perspective AI, with icons to make it easy to scan

Make the main call-to-action more bold and add a secondary “Learn More” link

Use soft background shapes or gradients to avoid a flat, auto-generated look, keeping colors on brand

If you want, I can even put together a quick visual wireframe mockup to show the idea before jumping into the code....

that usually helps speed things up.

I’m attaching some screenshots of similar UI work I’ve done to give you a feel for my style and approach.

Please let me know if it’s okay to start working on this!

Looking forward to contributing :)

Hey! Thanks a lot for sharing your ideas- they look amazing. 🙌
Right now, we’re focused on GSoC targets, so I’m tied up with the project. But once GSoC wraps up, we’d love to have your help with the Hero Page redesign! I can keep you in the loop and we can plan together after the period ends.

[ParagGhatage]

Hi! I’m interested in working on this issue. I plan to fix the UI bug and improve responsiveness. Will also ensure the code remains clean and maintainable. My idea and plan is ready and after completion will send a PR.... Could you please assign this issue to me?

Hi! Appreciate your enthusiasm and the plan you shared. 👍
Currently, we’re fully focused on GSoC tasks, so I’m already working on the project with the mentor. But after GSoC, it’d be great to have your contributions for UI improvements and bug fixes!

[ronit-ghosh]

Hi @ParagGhatage,
I read your response and completely understand that the focus is on GSoC tasks right now. I still went ahead and created a design mockup. Whenever it’s time to look into UI changes, please do let me know, I’d be happy to contribute.