แนะนำวิธีการใช้งานโปรแกรมออกแบบหน้าจอ InVision Studio
โปรแกรม
InVision Studio เป็นโปรแกรมออกแบบ
Prototype เพื่อให้คนที่ใช้(User)ใช้งานแล้วไม่งงหรือให้เห็นภาพในการใช้งาน เป็นโปรแกรมที่ใช้งานง่าย สามารถแชร์งานให้ทีมไปใช้งานทั้งตัว Desing และ ชุด
API มีระบบ Design version control เพื่อควบคุมการดีไซน์งาน ไม่ว่าจะใช้เวอร์ชั่นไหนก็จะปรับให้ออกมาในทิศทางเดียวกันได้
มาดูวิธีการใช้งานในแต่ละส่วนกันเลย
- หน้าแรกของโปรแกรม InVision
- vision.JPG (70.56 KiB) Viewed 730 times
- ตรงนี้จะเป็นหน้าแรก ในกรณีที่เรายังไม่เข้าสู่ระบบ
- คลิกคำว่า signup free
- ลงชื่อใช้งาน
- vision2.JPG (54.53 KiB) Viewed 730 times
- กรอกอีเมลและรหัสผ่าน
- รูปแบบโปรเจค
- vision3.png (87.8 KiB) Viewed 712 times
- เมื่อกรอกรายละเอียดเรียบร้อยแล้ว
- คำว่า create ด้านบนซ้ายมือ คือการที่เราจะเพิ่มโปรเจคงาน
- ปุ่มเพิ่มโปรเจค
- vision4.png (38.26 KiB) Viewed 730 times
- เมื่อ create แล้ว ให้เลือกคำว่า prototype
- ปุ่มโปรโตรไทป์
- vision5.JPG (50.72 KiB) Viewed 730 times
- กรอกชื่อโปรเจค
- เลือกรูปแบบที่เราต้องการออกแบบ
- all documents
- vision6.png (71.52 KiB) Viewed 712 times
- รูปแบบหรือโปรเจคที่เราสร้างหรือการแชร์งานจะมาปรากฎตรง all documents ทั้งหมด
- created by me
- vision7.png (68.06 KiB) Viewed 712 times
- งานที่เราออกแบบจะมาอยู่ที่ created by me
- แชร์งาน
- vision8.png (48.6 KiB) Viewed 712 times
- people เพิ่มบุคคล กลุ่มที่เราแชร์งาน
ทั้งนี้ InVision Studio เหมาะสำหรับการที่ทำงานเป็นทีม
Design system ,
design version control ตัวจัดเก็บโค้ด เก็บ Live
component ที่เป็นตัวโค้ดสามารถใช้งานองค์กร, สามารถแชร์ให้กับทีมอื่นได้แต่จะมีข้อเสียอยู่อย่างหนึ่งคือ InVision Studio ต้องทำงานโดยอินเทอร์เน็ตเท่านั้น