Create Three-Step Introduction Modal

[LazarusAA]

Description

Develop a multi-step introduction modal component that guides users through the app's key features. The modal should consist of three distinct steps as per the Figma design, each step clearly explaining different aspects of the app. Ensure the following:

• Navigation: Include intuitive "Next" and "Back" buttons to navigate between steps, along with a "Close" option to exit the modal at any time.
• Design Consistency: Adhere closely to the Figma design specifications for layout, typography, and styling.
• Responsiveness: Ensure the modal is fully responsive and offers a seamless experience across various devices.

This component will serve as an engaging introduction to the app, enhancing the overall user onboarding process.

Figma Design

Image Resources

[Vishal649-bot]

Hello, I'm Vishal , a full-stack web and blockchain developer.

I believe this issue perfectly matches my skill set, and I can fix it. Kindly assign it to me.

[Favvie]

Hi. My name is Favour, a frontend engineer with 2+ years experience developing pixel-perfect design. I’d like to contribute by building out an accessible, and responsive multi-step modal.

I’ve previously implemented multi-step, multi-page authentication modal in previous projects and I am confident I can handle this issue.

I can quickly implement this feature. Let me know if I can proceed!

[Rayguti]

Hi, I'm Raul Gutierrez, a software engineer with experience in web development using tools like Angular, React, Tailwind, Figma, TypeScript/JavaScript, Node.js, and more.

I am confident that I can effectively translate the Figma design into the WebApp while ensuring high-quality code and best practices.

For this task, I will develop a multi-step introduction modal that guides users through the app’s key features. The modal will consist of three distinct steps, each clearly presenting different aspects of the app while maintaining design consistency with the Figma specifications.

To ensure a seamless user experience, I will implement:

• Intuitive Navigation: "Next" and "Back" buttons for smooth progression between steps, along with a "Close" option for easy dismissal.
• Design Accuracy: Strict adherence to the Figma design in terms of layout, typography, and styling.
• Full Responsiveness: Optimized rendering across various devices for a consistent and engaging onboarding experience.

This component will enhance user onboarding by providing a structured and visually polished introduction to the app.

Looking forward to contributing to this project!

[Ezeh20]

ETA: I estimate about 8 - 24 hrs to close the introduction modal ticket

Hi, I am a frontend dev with over 3 years of experience (2yr real world experience). I have the ability to translate UI designs into pixel perfect solutions.

I use Next, Nuxt.js, React and Vue

Hi, I am a frontend dev with over 3 years of experience (2yr real world experience). I have the ability to translate UI designs into pixel perfect solutions.

I have gone through the description, the multi step modal is a fairly straight forward task and would take about 24hr to complete once approved.

I use Next, Nuxt.js, React and Vue

[greatest0fallt1me]

Hello! I’d love to work on this and help improve the project structure. With my experience in Cairo, StarkNet, and smart contracts, I can ensure a smooth and efficient implementation.

🔹 About Me

• Blockchain Specialist – Extensive experience with Ethereum, Hyperledger, and smart contract development, ensuring secure and efficient blockchain solutions.
• Full-Stack Developer – Proficient in JavaScript (Node.js, Express) for backend development and React, Next.js for creating interactive frontends.
• Agile Practitioner – Strong advocate of Agile methodologies and cross-functional teamwork, ensuring projects are delivered on time and within scope while maintaining high quality.

⏳ Estimated Time

I’ll have this task completed within one day, making sure everything is properly updated and tested.

Let me know if I can get started—excited to contribute! 🚀

[LazarusAA]

@Ezeh20, Assigned! 🚀