Wireframing and Prototyping

Message from Simran

Pre-Session Materials

Session Materials

Video:

Encore (Example)

Lo-fi

https://www.figma.com/file/loDMKLbnwIpfocz0V3fhNP?embed_host=notion&kind=&node-id=0%3A1&viewer=1

Hi-fi

https://www.figma.com/file/SS4P2jlzNJkbfyzMDjEg7n?embed_host=notion&kind=&node-id=0%3A1&viewer=1

Post-Session Materials

Learn Figma:

1. https://www.youtube.com/watch?v=kbZejnPXyLM
2. https://www.youtube.com/watch?v=FTFaQWZBqQ8

Prototyping on Figma:

1. https://help.figma.com/hc/en-us/articles/360040314193-Guide-to-prototyping-in-Figma
2. https://www.uiprep.com/blog/ultimate-guide-to-prototyping-in-figma
3. https://www.youtube.com/watch?v=-sAAa-CCOcg
4. https://www.youtube.com/watch?v=iBkXf6u8htI

Designer and Product Manager Collaboration

1. https://www.youtube.com/watch?v=35WzgKFXDRA
2. https://www.youtube.com/watch?v=0Hq9u-IjET8
3. https://uxplanet.org/how-product-managers-can-work-effectively-with-product-designers-a5175dcb9e51
4. https://balsamiq.com/learn/articles/product-managers-relationships-designers/
5. https://www.productplan.com/learn/product-and-ux-collaborate/

Wireframing Plugins (Figma)

1. https://www.figma.com/community/plugin/742764242781786818/Wireframe
2. https://www.figma.com/community/plugin/1071077298865016770/Ink-Wireframe
3. https://www.figma.com/community/plugin/764471577604277919/Wire-Box
4. https://www.figma.com/community/plugin/787660853629435276/Wireframer

Figma Plugin for Product Managers (Product Planner):

1. https://www.figma.com/community/plugin/766652281834442616/Product-Planner

No-Code tools for prototyping/MVP

1. Carrd.co — launch one-page websites for anything
2. Notion.so — manage content, ideas, client information, plans, and almost anything
3. Glideapps.com — create an app without writing a single line of code