Design

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

 

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

  1. ช่วยสร้าง ​ Prototype ที่สมจริงมากขึ้น
    เนื่องจากระบบการทำงานแบบ Code Visually ที่ใช้ Web-logic ในการออกแบบ จึง Auto Generate โค้ดไปเลยในตัว ช่วยสร้าง HTML, CSS กันเลยสดๆ ทำให้ได้เว็บตรงตามที่ออกแบบเป๊ะๆ
  2. รองรับ Responsive
    ย่นระยะเวลาที่ต้องคอยออกแบบ Desktop ทีนึง Mobile ทีนึง ด้วย Reusable Component ที่สามารถออกแบบให้รองรับกับหน้าจอหลายๆ ขนาดได้
  3. สร้าง Animation และ Micro-interaction
    เพิ่มลูกเล่นด้วยการกำหนด Tricker และ Effects ให้กับจุดต่างๆ ในเว็บโดยไม่ต้องโค้ดเองแม้แต่บรรทัดเดียว
  4. สร้าง Dynamic Content พร้อมเชื่อมการทำงานกับหลังบ้าน
    ไม่เพียงแต่การสร้าง Landing Page ทั่วๆ ไป แต่ยังสามารถเชื่อมการทำงานหลังบ้านด้วยระบบ CMS ที่สามารถจัดการ Content บนหน้าเว็บในสเกลเล็กๆ ไปจนถึง Ecommerce ขนาดใหญ่ได้ด้วย

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

ตัวอย่าง หน้าตา UI และ Panel การใช้งานของ Webflow

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

ตัวอย่าง การออกแบบในแต่ละขนาดหน้าจอ (Responsive)

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

ตัวอย่าง การสร้าง Hover Effects ให้กับองค์ประกอบต่างๆ

Recap: ‘“Webflow: Design = Code’’ — Skooldio Alumni Meetup #1 | Skooldio Blog

Up Next

สำหรับผู้ที่อยากได้สิทธิ์มามีทอัพครั้งต่อๆ ไป มาเรียนกับเราที่ Skooldio ได้ทั้ง Workshop หรือจะเรียนออนไลน์ก็ได้นะครับ ดูคอร์สทั้งหมดได้ที่นี่ แล้วเจอกันครับ 🙂

You may also like

Design

Figma คืออะไร? ทำไมถึงเป็น Tool มาแรงที่สุดในวงการ Design!

Figma คืออะไร ??? ทำไมจึงเป็นเครื่องมือออกแบบอันดับ 1 ที่ UXUI Designer ทั่วโลกเลือกใช้  Figma คือเครื่องมือออกแบบที่ขึ้นแท่นอันดับ 1 ในปี 2022 โดยสามารถใช้ออกแบบได้ตั้งแต่เว็บไซต์, ...
UX Writing คืออะไร
Design

ไขข้อข้องใจ! UX Writing คืออะไร ทำไมสำคัญกับ Product พร้อมตัวอย่างน่าสนใจ

UX Writing คืออะไร? ทำไมต้องรู้จักคำนี้ด้วยนะ? คุณอาจจะเคยผ่านการใช้งาน Application มากหน้าหลายตาในแต่ละวัน ซึ่งแอปฯ บางตัวก็ทำให้คุณรู้สึกดีตลอดการใช้งาน เข้าแล้วไม่อยากออก เข้าแล้วอยากเข้ามาใช้บ่อยๆ ทุกวัน แต่กลับกันกับแอปฯ บางตัวที่ทำให้คุณหงุดหงิดใจตลอดการใช้งาน อยากออกแทบตาย ...

More in:Design

Web Design Font Pairing Design

เทคนิคการจับคู่ฟอนต์ไม่ให้เละ ฉบับ Web Designer มือโปร

หนึ่งในปัญหาใหญ่ของคนเริ่มต้นออกแบบเว็บ คือเรื่องของการเลือกใช้ฟอนต์ที่ดูเหมือนง่ายแต่ยาก ยิ่งเป็นเรื่องของการจับคู่ฟอนต์ที่ต่างกันให้มาอยู่ด้วยกันอย่างลงตัวสวยงามยิ่งยากเข้าไปใหญ่ วันนี้เราเลยนำรวมเทคนิคดีๆ ในการจับคู่ฟอนต์ฉบับ Web Designer มือโปรมาเล่าสู่กันฟัง 1.ใช้ฟอนต์ที่ให้ระดับอารมณ์แตกต่างกัน หน้าตาของฟอนต์มีผลต่ออารมณ์ความรู้สึกของคนอ่าน การลองจับคู่ฟอนต์ที่ให้อารมณ์แตกต่างกันจะช่วยให้หน้าเว็บดูมีลูกเล่น น่าสนใจ ไม่ราบเรียบจนเกินไป ก่อนที่จะเลือกจับคู่ฟอนต์ ต้องพิจารณาก่อนว่าบุคลิกเว็บที่เรากำลังออกแบบเป็นอย่างไร ...
ui-design-Cover Design

ถอดองค์ประกอบการออกแบบ UI ที่ดี ด้วยหลัก ‘Component-based Design’

สิ่งหนึ่งที่สำคัญมากในการออกแบบ UI ที่นักออกแบบทุกคนควรรู้ นั่นคือเรื่องของ ‘Component-based Design’ คือการมองแยกส่วนประกอบต่างๆ ที่ร่วมกันเป็นหน้าเว็บไซต์หรือแอปฯ ที่เราออกแบบว่ามีส่วนประกอบมาจากอะไรบ้าง หากใครผ่านการเรียนการออกแบบมาก่อน อาจจะคุ้นเคยกับหลักองค์ประกอบการวาดรูปที่เริ่มตั้งแต่จุด จุดต่อกันกลายเป็นเส้น จากเส้นต่อกันเป็นระนาบ และระนาบประกบกันเป็นรูปทรง เช่นเดียวกันกับการออกแบบ ...
psychology ux ui blog cover Design

หลักจิตวิทยากับการช่วยออกแบบ UX UI ให้ชีวิต User ง่ายขึ้น

ใครที่กำลังทำงานหรือศึกษาเรื่อง UX UI น่าจะเคยผ่านตาเรื่องของหลักจิตวิทยาการออกแบบที่นำมาใช้กับ UX UI กันบ้างแล้ว แต่เอาเข้าจริงแล้วในฐานะคนที่เป็นหรืออยากเป็น UX/UI Designer ควรมีความรู้พื้นฐานด้านจิตวิทยามากน้อยแค่ไหน โดยหลักการแล้วหลักจิตวิทยาจะช่วยให้ User ใช้งานเว็บหรือแอปฯ ที่เราออกแบบได้อย่างมีประสบการณ์ที่ดีได้อย่างไร ...
Business

ทำความรู้จัก Design Thinking – สกิลมาแรงที่บริษัทชั้นนำทั่วโลกกำลังมองหา

Design Thinking ไม่ใช่แค่ชื่อวิชาในคลาสเรียนของเด็กออกแบบ แต่เป็นสกิลที่กำลังเป็นที่ต้องการของบริษัทชั้นนำในหลายประเทศทั่วโลก เช่น Apple, Google , Microsoft, Tesla หรือ Startup ไทยอย่าง Bitkub อีกด้วย ...

Comments are closed.