ซอฟต์แวร์ใดดีที่สุดสำหรับการออกแบบ GUI?


9

ฉันใช้ Photoshop อย่างกว้างขวาง แต่ความจริงของเรื่องนี้ก็คือมันเป็นเครื่องมือแก้ไขภาพ มันมีเอฟเฟกต์ที่ซับซ้อนอยู่บ้างเช่นเงาตกและแสงจากภายในและภายนอกเป็นต้น แต่มันก็ไม่เพียงพอเมื่อออกแบบส่วนต่อประสานกราฟิก ตัวอย่างเช่นคุณไม่สามารถเพิ่มการไล่ระดับสีที่สามารถแก้ไขได้หลายรายการ และคุณต้องใช้เครื่องมือเพื่อดึงเอฟเฟกต์ที่คุณต้องการเมื่อไม่ได้ออกแบบมาสำหรับสิ่งนั้น

ฉันเริ่มใช้ดอกไม้ไฟและมีบางสิ่งที่ฉันชอบเช่นความสามารถในการเปลี่ยนเส้นโค้งบนสี่เหลี่ยมผืนผ้าที่โค้งมน แต่ตัวเลือกสีในโปรแกรมนั้นไม่สามารถใช้งานได้ เมื่อคุณเข้าไปในเครื่องมือเลือกสีของ Mac มันบอกว่าสีนั้นเป็นสิ่งที่แตกต่างจากสีเดิมเนื่องจาก Fireworks ไม่สามารถจัดการโปรไฟล์สีได้อย่างถูกต้อง ทำให้การปรับสีเป็นกระบวนการที่ยากมาก และซอฟต์แวร์โดยรวมให้ความรู้สึกเหมือนเป็นรุ่นก่อนวางจำหน่าย (และอาจเป็นได้)

ดังนั้นฉันสงสัยว่าทุกคนจะแนะนำซอฟต์แวร์สำหรับการสร้าง GUI? ต้องมีซอฟต์แวร์บางอย่างที่ช่วยให้คุณมีเอฟเฟกต์ที่สามารถแก้ไขได้ซึ่งคุณสามารถเปลี่ยนเปลี่ยนลำดับย้ายไปรอบ ๆ ได้ตลอดเวลารวมถึงเครื่องมืออื่น ๆ ที่จำเป็นในการสร้างกราฟิกที่ยอดเยี่ยม


จากคำตอบทั้งหมดที่นี่เราต้องการให้คุณชี้แจงคำถาม ฉันเชื่อว่าคุณกำลังขอซอฟต์แวร์เพื่อสร้างองค์ประกอบ GUI ที่แท้จริง ... ไอคอนปุ่ม ฯลฯ หรือคุณกำลังถามเกี่ยวกับ wireframing?
DA01

คำตอบ:


7

ไม่มีซอฟต์แวร์ "ดีที่สุด" สากลสำหรับการออกแบบ GUI ขึ้นอยู่กับการตั้งค่าซอฟต์แวร์ / เวิร์กโฟลว์ของคุณ

Photoshop

ฉันไม่แน่ใจว่าคุณหมายถึง "หลายการไล่ระดับสีที่แก้ไขได้" แต่ถ้าคุณรู้ว่าคุณกำลังทำอะไร Photoshop เสนอเครื่องมือทั้งหมดที่คุณต้องการในการออกแบบ GUI ที่คุณสามารถจินตนาการได้ ไม่จำเป็นต้องมี "เครื่องมือหลอกลวง"

แม้จะมีชื่อ Photoshop ก็มีวิวัฒนาการที่ไกลเกินกว่าจะเป็นเครื่องมือแก้ไข / จัดการภาพถ่ายอย่างง่ายและไม่มีเหตุผลใดที่คุณไม่สามารถออกแบบ GUI ได้ Photoshop อาจมีชุดเครื่องมือแก้ไขภาพแรสเตอร์ที่ครอบคลุมที่สุดของโปรแกรมกราฟิกใด ๆ ในตลาดและมันถูกใช้สำหรับทุกอย่างตั้งแต่การวาดภาพดิจิทัลไปจนถึงการระบายสีการ์ตูนหนังสือจนถึงภาพประกอบการออกแบบเว็บและ UI การผลิตวิดีโอและการสร้างเกม 3 มิติ นิติ

คุณสมบัติเช่นมาสก์การปรับปรุง, เลเยอร์พา ธ , เวกเตอร์พา ธ , วัตถุอัจฉริยะ, เลเยอร์คอมพ์ ฯลฯ ทำให้เป็นตัวเลือกที่เป็นธรรมชาติสำหรับการออกแบบ UI สำหรับผู้ที่คุ้นเคยกับอินเทอร์เฟซและชุดคุณลักษณะลึก ข้อดีอีกอย่างคือมันรวมเข้ากับเครื่องมืออย่าง Illustrator, Flash Catalyst และแอพ / ปลั๊กอินของบุคคลที่สามมากมาย

ดอกไม้ไฟ

หลายคนชอบ Fireworks สำหรับการออกแบบเว็บเนื่องจากเป็นสิ่งที่ออกแบบมาโดยเฉพาะและด้วยเหตุนี้จึงเป็นเครื่องมือที่ดีสำหรับการออกแบบ GUI เป็นหน้าเชิงวัตถุและสนับสนุนสัญลักษณ์และสไตล์ Fireworks ยืมตัวเองเป็นอย่างดีกับเวิร์กโฟลว์การออกแบบ UX ผู้คนจำนวนมากพบว่าดอกไม้ไฟช่วยให้พวกเขาควบคุมพิกเซลได้อย่างสมบูรณ์แบบยิ่งขึ้นโดยไม่ต้องหันไปหาผู้ปกครองไกด์หรือเครื่องมือวัด

นอกจากนี้ดอกไม้ไฟยังมีคุณสมบัติที่ดีมากมายเช่นเกรเดียนต์ไล่ระดับ, ASE swatches และในบางวิธีการควบคุมการพิมพ์ที่ดีกว่า Photoshop เว็บเลเยอร์ของ Fireworks และการรวมเข้ากับ Device Central ของ Adobe ทำให้ง่ายต่อการสร้างต้นแบบอย่างรวดเร็วสำหรับอุปกรณ์หลายเครื่อง

ผู้วาดภาพประกอบ

อีกหนึ่งแอพยอดนิยมในหมู่นักออกแบบ UX คือ Illustrator ซึ่งแบ่งปันจุดแข็งมากมายกับ Fireworks เช่นเดียวกับดอกไม้ไฟมันสนับสนุนสัญลักษณ์รูปแบบวัตถุขั้นสูงหลายกระดาน (คล้ายกับหน้า) และสิ่งอำนวยความสะดวกการแก้ไขเวกเตอร์ที่ดียิ่งขึ้น

Photoshop, Fireworks, Illustrator รวมถึง InDesign ล้วนมีชุด wireframe / stencil และแม่แบบ UX สำหรับพวกเขาบนเว็บ แต่การออกแบบแบบโมดูลาร์ UX นั้นง่ายกว่าใน Illustrator และ Fireworks เนื่องจากการสนับสนุนห้องสมุดสัญลักษณ์ที่ใช้ซ้ำได้

Illustrator ยังรองรับสไตล์ของตัวละครและย่อหน้าทำให้คุณสมบัติการออกแบบตัวอักษรนั้นเหนือกว่า Photoshop หรือ Fireworks นอกจากนี้ Illustrator ยังเหมาะสำหรับการแสดงภาพประกอบดังนั้นไอคอนหรือกราฟิกเว็บใด ๆ ที่คุณอาจต้องการสร้างสามารถทำได้ในโปรแกรมเดียวกัน

InDesign

InDesign เป็นอีกหนึ่งแอพที่ได้รับความนิยมมากในหมู่ IAs, IxDs และอื่น ๆ สิ่งอำนวยความสะดวกด้านการออกแบบกราฟิกอาจมี จำกัด แต่การรองรับหน้าย่อหน้าและสไตล์ของตัวละครสนิปเพตและไลบรารีวัตถุทำให้เหมาะสำหรับงานออกแบบ UX InDesign ยังมีสิ่งอำนวยความสะดวกเรียงพิมพ์ขั้นสูงมากและสนับสนุนเค้าโครงตาราง สิ่งนี้พร้อมกับการรวม InCopy และ Adobe Digital Publishing Suite ทำให้เป็นทางเลือกที่เป็นธรรมชาติสำหรับ บริษัท สื่อสิ่งพิมพ์ที่ต้องการออกแบบแอพมือถือสำหรับนิตยสารของพวกเขา


แต่ในตอนท้ายของวันทุกเครื่องมือมีจุดแข็งและจุดอ่อนของมัน แอพเฉพาะ UX ส่วนใหญ่เช่น Axure, Balsamiq, OmniGraffle และอื่น ๆ มีคุณสมบัติเฉพาะ UX ที่ยอดเยี่ยมสำหรับการออกแบบเลย์เอาต์ / โครงร่าง / ปฏิสัมพันธ์ แต่ในตอนท้ายของวันคุณยังคงต้องออกแบบกราฟิกสำหรับ UI ซึ่งเครื่องมือการออกแบบกราฟิกเช่น Photoshop / Fireworks / Illustrator จำเป็นสำหรับ

นั่นเป็นสาเหตุที่เวิร์กโฟลว์การออกแบบ UI ส่วนใหญ่มีมากกว่าหนึ่งแอพ ดังนั้นหากคุณไม่เกี่ยวข้องกับกระบวนการออกแบบ UI เพียงส่วนเดียวเช่น wireframing หรือสร้างไลบรารี UX หรือการสร้างต้นแบบจากนั้นจะไม่มี "ซอฟต์แวร์ที่ดีที่สุด" เดียว


2

ดินสอเป็นเครื่องมือออกแบบ GUI ขนาดเล็กและใช้งานง่าย

Top features:
Built-in stencils for diagraming and prototyping
Multi-page document with background page
Inter-page linkings!
On-screen text editing with rich-text supports
Exporting to HTML, PNG, Openoffice.org document, Word document and PDF.
Undo/redo supports
Installing user-defined stencils and templates
Standard drawing operations: aligning, z-ordering, scaling, rotating...
Cross-platforms
Adding external objects
Personal Collection
Clipart Browser
Object snapping
Sketchy Stencil
And much more...

ป้อนคำอธิบายรูปภาพที่นี่


เป็นเครื่องมือ wireframing ที่ดี แต่ฉันคิดว่า OP กำลังมองหาเครื่องมือแก้ไขกราฟิก
DA01

1

ฉันทำงานที่ไหนเราใช้ Indesign เรามักจะสร้างเลย์เอาต์แบบกริดที่สะอาดด้วยสไตล์การพิมพ์ที่พิถีพิถันและสำหรับการออกแบบที่ยอดเยี่ยม มันมีการควบคุมอย่างละเอียดเกี่ยวกับลักษณะตัวละครย่อหน้าและรูปแบบของวัตถุซึ่งแปลได้ดีกับ CSS และช่วยให้สามารถปรับองค์ประกอบเหล่านี้ได้ทุกที่ในกระบวนการ มันไม่ดีนักเมื่อส่งออกองค์ประกอบกราฟิก แต่เราพบว่าการแลกเปลี่ยนนั้นคุ้มค่า


1

หนึ่งในเครื่องมือสร้างต้นแบบ GUI ที่ไม่คาดคิดมากที่สุดคือ Keynote ฉันรู้ว่ามีนักออกแบบ UI ระดับแนวหน้าจำนวนมากที่สาบานได้และKeynotopiaเป็นทรัพยากรที่ยอดเยี่ยมสำหรับการใช้ Keynote ด้วยวิธีนี้ ถ้าฉันไม่เห็นว่ามันถูกใช้อย่างมีประสิทธิภาพฉันก็อาจจะไม่เชื่อ แต่มันก็ใช้ได้ดีทีเดียว หากคุณใช้ Mac ลองใช้ดู!


0

ผมทำงานที่Pidoco

ด้วยเครื่องมือสร้างต้นแบบของเราคุณสามารถพัฒนาต้นแบบสำหรับเว็บไซต์แอพมือถือหรือซอฟต์แวร์ คุณสามารถจำลอง mockup โดยตรงบนเดสก์ทอป, มาร์ทโฟนหรือแท็บเล็โดยใช้ฟรี Pidoco App จากAppStoreและจากGoogle Play

คุณสมบัติที่สำคัญคือ:

  • การทำงานร่วมกันแบบเรียลไทม์
  • ส่งออกเป็น HTML, PDF, Word, PNG, SVG
  • ลายฉลุจำนวนมาก
  • แม่แบบ
  • ลายฉลุที่กำหนดเอง
  • SaaS เพื่อให้คุณสามารถใช้งานได้จากเบราว์เซอร์ใด ๆ

2
โปรดอย่าประชาสัมพันธ์ บริษัท ของคุณในทุกคำถามที่ถามเกี่ยวกับ wireframing แม้ว่าจะขอบคุณที่เปิดใจว่าคุณเป็นพนักงานที่นั่น
DA01
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.