👋 Hi, my name is Jad and today I will share my process of designing an app using AI.

🤖 I will use Claude for requirements and ideation, UX Pilot and FigJam for diagrams and wireframes, and Visily for UI design and prototyping.

📊 I will focus on UI only to help you convert ideas into designs and interactive prototypes, creating an MVP or proof of concept for an app.

📝 First, I asked Claude to act as a client and provide requirements for a premium meal delivery service, including target audience, core features, and key user flows.

📈 I organized the requirements in FigJam and used the UX Pilot plugin to create diagrams, focusing on core features like payment, notifications, onboarding, meal selection, checkout, and delivery tracking.

📄 I generated a summary of the pages and their content based on the requirements, leading to the wireframe phase in UX Pilot.

🖼️ I created wireframes for six pages in UX Pilot and then took screenshots to import into Visily for UI design.

🎨 In Visily, I started with the navigation bar, ensuring a consistent tab bar across all pages, and saved it as a component for reuse.

🔍 I audited each page for missing or unnecessary elements, ensuring the design made sense and was visually appealing.

📱 I created an interactive prototype in Visily, allowing for navigation and interaction, although some features like overlays needed workarounds.

✨ The final product is a proof of concept that can be showcased and interacted with on mobile devices.

💡 While AI is helpful for starting projects, I still prefer manual design work for achieving the perfect design.

❓ If you have any questions, feel free to ask in the comments. Thank you for joining, and see you in the next video!