คุณต้องสามารถอธิบายวิสัยทัศน์ของคุณได้หากคุณคาดหวังให้นักพัฒนาเว็บของคุณแบ่งปันวิสัยทัศน์ของคุณในฐานะคนที่เคยอยู่ทั้งสองฝั่งของสัญญา ในฐานะนักแปลอิสระและในฐานะลูกค้า หนึ่งในสิ่งที่น่ายินดีที่สุดที่คุณสามารถทำได้สำหรับนักแปลอิสระคือช่วยเหลือพวกเขาในงานของพวกเขาอย่างมีความหมายคุณเป็นลูกค้าจากนรก?เมื่อพูดถึงการพัฒนาเว็บ นั่นหมายถึงสองสิ่ง ขั้นแรก อ่านClients
From Hellและมุ่งมั่นที่จะไม่เป็น “ผู้ชายคนนั้น” ประการที่สอง
พร้อมที่จะนำเสนอนักพัฒนาเว็บของคุณด้วยโครงร่าง
เมื่อฉันพูดคำว่า wireframe คุณนึกถึงอะไร? หากคุณกำลังนึกถึง CGI ยุค 80 และโมเดลหลายเหลี่ยม คุณก็คิดผิดไปเล็กน้อย โครงร่างการออกแบบเว็บเป็นเหมือนโครงกระดูกหลายเหลี่ยม แต่สำหรับเว็บไซต์
โครงร่างคืออะไร?
เป็นเลย์เอาต์กราฟิกและการออกแบบที่ไม่ต้องการการเขียนโค้ด การจัดการภาพ หรือแม้แต่อะไรมากไปกว่าการใส่ดินสอลงบนแผ่นกระดาษกราฟ เพียงตรวจสอบตัวอย่าง บางส่วน เหล่า นี้
ที่เกี่ยวข้อง: แปดทักษะผู้ประกอบการต้องมีเพื่อความสำเร็จ
Wireframe เป็นเครื่องมือที่มีประโยชน์อย่างมากสำหรับนักพัฒนาเว็บ มันแสดงให้เห็นอย่างชัดเจนถึงสิ่งที่คุณมีอยู่ในใจและให้แนวคิดเกี่ยวกับขนาดขององค์ประกอบต่างๆ ซึ่งเป็นองค์ประกอบสำคัญที่คุณต้องการรวมไว้ในเพจของคุณ โครงร่างเป็นเหมือนเล่ห์เหลี่ยมการเข้ารหัสที่พวกเขาอาจต้องใช้เพื่อทำให้ทุกอย่างเกิดขึ้น
ด้วยวิธีนี้คุณจะไม่ทำให้พวกเขาประหลาดใจด้วยคำว่า “โอ้ และยังไงก็ตาม ฉันต้องการการนำทางบนแถบด้านข้าง” หรือ “นี่ อันที่จริง คุณทำให้ภาพนิ่งนั้นเป็นสไลด์โชว์ได้ไหม”
คุณจะประหยัดเวลา คุณจะประหยัดเงิน และคุณจะประหยัดเลือด หยาดเหงื่อ และน้ำตาของทั้งคุณและนักพัฒนาเว็บของคุณ
แต่เดี๋ยวก่อน! ฉันกลัว.
หากคุณกลัวเกี่ยวกับความซับซ้อนของโครงลวด ไม่ต้องกังวลไป คุณไม่จำเป็นต้องออกแบบทุกหน้าในเว็บไซต์อย่างเต็มรูปแบบ สิ่งที่คุณต้องการคือพื้นฐาน คุณจะต้องทราบว่าจะมีการนำทางที่ใดและเค้าโครงประเภทใดที่คุณต้องการสำหรับหน้าผลิตภัณฑ์ที่เกี่ยวข้อง: ห้าครั้งที่คุณควรแสดงอย่าบอกที่ทำงาน
คุณต้องการรายละเอียดสองสามข้อเกี่ยวกับจำนวนช่อง
เพิ่มเติมที่คุณต้องการสำหรับภาพขนาดย่อของบทความหรือผลิตภัณฑ์ที่เกี่ยวข้องอื่นๆ wireframes บางส่วนในแกลเลอรีด้านบนนั้นเรียบง่ายมาก ไม่มากไปกว่ากล่องจำนวนหนึ่งที่ซ้อนอยู่ในกล่องอื่นๆ แต่ก็ยังเพียงพอสำหรับนักพัฒนาเว็บในการเริ่มต้น
นอกจากนี้ โปรดจำไว้ว่า เป็นส่วนหนึ่งของงานของนักพัฒนาที่จะช่วยคุณปรับแต่งการออกแบบ พวกเขาสามารถบอกคุณได้ว่า “เฮ้ การออกแบบนี้รกไปหน่อย ถ้าเราตัดมันออกแล้วย้ายไปตรงนั้นล่ะ”
การออกแบบที่ทันสมัยเป็นกุญแจสำคัญ
พวกเขาสามารถบอกคุณได้ว่ามาตรฐานการออกแบบสมัยใหม่แนะนำว่าคุณไม่ควรให้ตัวนำทางอยู่ทางด้านขวาของรางน้ำ พวกเขาสามารถใช้โครงร่างของคุณเป็นฐาน มันเพิ่งตัดขั้นตอนการสร้างต้นแบบกลับไปกลับมา 5 หรือ 6 ขั้นแรกที่โดยปกติแล้วนักพัฒนาซอฟต์แวร์จะต้องดำเนินการเพื่อไปยังขั้นตอนนี้พร้อมกับคุณ
ที่เกี่ยวข้อง: การเริ่มต้นอย่างชาญฉลาด: การแปลงวิสัยทัศน์ของคุณให้เป็นผลิตภัณฑ์ที่ทำงานได้
ไวร์เฟรมยังสร้างได้ง่ายมาก ตราบใดที่คุณมีและมองเห็นภาพที่คุณต้องการให้ไซต์ของคุณมีหน้าตาเป็นอย่างไร ฉันได้บอกไปแล้วว่าคุณสามารถใส่ดินสอลงบนกระดาษหนึ่งแผ่นแล้วสร้างมันขึ้นมาได้ แต่คุณยังสามารถใช้หนึ่งในแอพที่มีอยู่มากมาย
มาตรฐานอุตสาหกรรมที่ฉันพบคือ Balsamiq ซึ่งทดลองได้ฟรีและซื้อได้ในราคาถูก หรือคุณสามารถใช้เครื่องมืออื่นๆ เช่นWireframe.cc , Moqups หรือ UXPin สำหรับโซลูชันบนเว็บ
หากคุณต้องการทำงานจากแท็บเล็ตหรืออุปกรณ์พกพา OmniGraffle ใช้งานได้บน iOS Wire Flow ใช้งานได้บน Android และ Fluid UI ใช้งานได้ทั้งสองอย่าง
ทุกสิ่งที่คุณทำคือกระบวนการ
จริงๆ แล้วมันไม่ยากอย่างที่คิด — หรือฟังดู โปรดจำไว้ว่าการผลิตสิ่งใดเป็นกระบวนการที่ทำซ้ำ การเปลี่ยนจากแนวคิดไปสู่แบบร่าง จากแบบร่างเป็นโครงลวด จากโครงลวดเป็นการออกแบบที่มีรายละเอียดมากขึ้น และจากตรงนั้นไปสู่ต้นแบบเป็นเรื่องปกติ
เครดิต :> เว็บแท้ / ดัมมี่ออนไลน์
