ui Tag

30 Days UI

สืบเนื่องมาจากโพสนี้ใน Facebook (ไม่น่าป่าวประกาศเลย) คืออยากหาอะไรทำให้ชีวิตไม่เหี่ยวเฉากับการงานที่เบื่อบ้าง ดีบ้าง และรู้สึกว่าช่วงนี้ตัวเองนิ่งไปพอสมควร ก็เลยคิดโปรเจคว่าเราทำอะไรดีวะที่ต้องทำทุกวันๆ สุดท้ายก็มาลงเอยที่ UI ละกันเพราะตอนนี้มันเป็นงานหลักของเรา โดยชิ้นนึงจะให้เวลาไม่เกิน 1 ชั่วโมงในการทำ และไม่สนเรื่อง UX เอาหน้าตาล้วนๆ ส่วน Blog นี้ก็จะเอาไว้อัพเดทงานทุกวัน ใครอยากติดตามก็ติดตามได้ที่ Blog นี้เลยเนอะ :)   Day 1 - Sign in form   Day 2 - User profile   Day 3 - Contact   Day 4 - Tab   Day 5 - Chat   Day 6 - Music player   Day 7 - Switch   Day 8 - Feed   Day 9 - Progress bar   Day 10 - Shopping

ทำ Loading Status ง่ายๆ ด้วย Photoshop

ห่างหายไปนาน กลับมาอีกทีพบกับเว็บโฉมใหม่ใหญ่สะใจกว่าเดิม ซึ่งยังไม่เสร็จดีอาจจะมีขาดๆเกินๆ ไม่เรียบร้อยบ้าง แต่จะค่อยๆ ปรับไปนะคร้าบ ตอนนี้ทนไม่ไหวเลยขออกติวเตอร์นิดหน่อยก่อน วันนี้เราจะมาวาดแถบ Loading หรือแถบ status แบบนี้กันครับ ปกติแล้วเนี่ย Photoshop วาด shape แบบนี้ไม่สะดวกเท่าใน illust แต่มันก็มีวิธีการทำง่ายๆ ถ้าเราอยากจบงานทีเดียวเลยใน photoshop ซึ่งหลายๆคน อาจจะรู้กันอยู่แล้ว แต่ผมก็ยังหน้าด้านสอน 555 มาเริ่มกันเลยดีกว่า เริ่มแรกเลยเราต้องใช้ shape layer ในการวาด ซึ่งเราจะสามารถปรับค่ามันได้หลายอย่าง โดยวาดรูปวงกลมขึ้นมาก่อนเลย   ต่อมาให้ duplicate layer ขึ้นมาอีกอันโดยอันล่างเราจะเก็บไว้ทำเป็น bg ของแถบนั้น ส่วนอันบนเราจะทำเป็นแถบวิ่งๆ       มาต่อกันที่ layer บนครับ ให้เราใช้ path selection tool หรือกด A เลือก shape ตัวนี้ครับ แล้วสังเกตด้านบนจะมี