Home » rgb72 » Currently Reading:

เบื้องหลังแนวคิดในการพัฒนาเว็บไซต์ใหม่ของ Property Perfect เวอร์ชั่น 2014 (www.pf.co.th)

July 28, 2014 rgb72 Comments

ผลงานล่าสุดของ rgb72 ที่เพิ่งจะเปิดตัวใช้จริง คือเว็บไซต์ของบริษัท อสังหาริมทรัพย์ที่ใหญ่ที่สุดแห่งหนึ่งของเมืองไทย บริษัท พร๊อพเพอร์ตี้ เพอร์เฟ็ค – Property Perfect (www.pf.co.th) ซึ่งงานนี้ถือเป็นการรื้อ re-design website ใหม่ทั้งหมดอีกครั้ง และในครั้งนี้จะเป็นการเล่าให้ฟังถึงเบื้องหลัง concept แนวความคิด และการทำงาน ที่ “กว่าจะมาเป็นเว็บไซต์ PF.co.th” ได้ ต้องผ่านอะไรมาบ้าง

ในการทำเว็บไซต์ใหม่ทุกครั้ง สิ่งที่เราต้องทำก็คือ

  1. การค้นหาข้อเสีย เพื่อ แก้ไขปรับปรุงให้ดีขึ้น
  2. การพัฒนาเว็บไซต์ด้วย concept ใหม่ โดยคำนึงถึงการใช้งานของ user ที่เปลี่ยนไปและใช้เทคโนโลยีที่เหมาะสม และ
  3. ตอบโจทย์ทางการตลาดที่ลูกค้าต้องการ

เราเริ่มต้นด้วยการการพูดคุยกับลูกค้าถึงปัญหาเดิมที่เคยมี ซึ่งตรงนี้ไม่ใช่เรื่องยาก เนื่องจากเราเคยได้ทำงานให้กับทาง PF มาบ้างแล้วก่อนหน้านี้ ดังนั้นจึงไม่ใช่การเริ่มต้นใหม่ตั้งแต่ศูนย์ซะทีเดียว

ความสวยงาม, ความพอดี, การเข้าถึงข้อมูลที่รวดเร็ว, การใช้งาน, และ performance คือสิ่งที่เราต้องการปรับปรุงจากเว็บเดิม

โครงสร้างของเว็บ ที่เริ่มต้นจากหน้าแรก เข้ามาแล้ว user สามารถเลือกเข้าดู “บ้านเดี่ยว” “ทาวน์โฮม” หรือ “คอนโด” ได้นั้น ยังอยู่เหมือนเดิม

แต่ที่น่าแปลกคือ เราได้สังเกตพฤติกรรมของ user แล้วพบว่า user ที่มักจะใช้ “sitemap” ที่อยู่ด้านล่างในส่วนของ footer เพื่อเข้าถึงแต่ละโครงการ มากกว่าการใช้เมนูด้านบน นั่นน่าจะเป็นเพราะ เมนูด้านบนของเดิม ไม่โดดเด่นพอ หรือว่าใช้ไม่ง่ายนัก หรือสอง user อาจจะชอบที่จะเหลือเข้าดูบ้านแต่ละโครงการด้วยการมองเห็นทั้งหมดก่อน แล้วจึงกดเลือกเข้าโครงการที่ตัวเองต้องการเลย.. ไม่ต้องการเลือกจากเมนูด้านบนที่มีหลาย step

ดังนั้น.. เราจึงแก้ไขสองจุดด้วยการ 1. ปรับการออกแบบ เมนูด้านบนใหม่ และ 2. ถ้า user ชอบเข้าถึงจาก footer อยู่แล้ว เราก็จะพัฒนาให้ footer นั้นใช้งานได้ดีขึ้น!

ตัวเมนูด้านบน เราเพิ่มรูปภาพ สร้างเมนูที่ใหญ่ขึ้น เนื่องจากโครงการของ PF นั้นมีจำนวนมาก และสร้าง shortcut เพื่อเข้าถึงแต่ละ brand ได้รวดเร็วยิ่งขึ้น

ส่วนตัว footer เรายังยึด concept เดิม คือตีแผ่ทุกโครงการออกมา แต่ “เพิ่ม” feature ที่ให้ user สามารถเลือกดูโครงการทั้งหมดในรูปแบบของ “map view” ด้วย

สิ่งที่เป็น concept ใหม่ที่เราต้องการนำเสนอ เพื่อตอบโจทย์วิถีการใช้งานเว็บไซต์ที่เปลี่ยนไปของ user ในปัจจุบัน ซึ่งมีมากมายหลายอย่าง หนึ่งในสิ่งที่ต้องปรับปรุงเร่งด่วนเลยก็คือ การเพิ่มความสามารถให้กับเว็บไซต์เพื่อ support อุปกรณ์เคลื่อนที่ประเภท Mobile device.. และคำว่า Mobile device ในที่นี้ไม่ได้พูดถึงแค่ Smart phone เท่านั้น แต่รวมไปถึงอุปกรณ์พกพาจำพวก tablet และ iPad ซึ่งเป็นอีกหนึ่งอุปกรณ์ที่มีเทรนด์กำลังเติบโตอย่างต่อเนื่อง

แน่นอนว่า เมื่อเราบอกว่าต้องการ support อุปกรณ์พกพา ดังนั้นหลักการใช้งานของเว็บนี้ก็ต้องเป็นหลักการใช้งานที่คนเล่นอุปกรณ์จำพวก tablet นี้คุ้นเคย เช่นการ swipe เลื่อนภาพ, การสร้างปุ่มให้ใหญ่พอดีกับนิ้วให้สามารถกดได้อย่างง่ายดาย และอื่นๆอีกมากมาย

แต่ความยากของการสร้างเว็บไซต์นี้ไม่ได้อยู่ที่งาน production การออกแบบ หรือการเขียน coding แต่อย่างใด

ความยากมันอยู่ที่ “เวลา”

เวลาเป็นสิ่งที่ท้าทายยิ่ง! งานนี้เราได้รับโจทย์ล่วงหน้ามาพอสมควร แต่กว่าทุกอย่างจะลงตัวพร้อมเริ่มงานได้ เราก็มีเวลาเหลือไม่มากนัก ซึ่งนั่นเป็นสิ่งที่ท้าทายสำหรับเรา

เมื่อลูกค้าแจ้งเราว่า ระยะเวลาที่เหลืออยู่นี้พอจะทำได้สำเร็จทันไหม? ผมตอบลูกค้าไปว่า “ทันครับ”

จากนั้นเมื่อถึงเวลาเริ่มงาน ทีม production rgb72 ได้ทำการประชุมภายใน เราตั้งคำถามกันว่า เราจะต้องการทีมงาน outsource เข้ามาเพิ่มเพื่อช่วยเหลือมั้ย? ซึ่งทางทีมให้คำตอบมาว่า “เรามาทำเองเสาร์-อาทิตย์ ลุยกันไปเลยดีกว่า”

เมื่อความมุ่งมั่นเป็นเช่นนั้น เรา rgb72 ก็ได้เริ่มทำงานโดยไม่หยุดเสาร์-อาทิตย์เลย เป็นเวลา 3 สัปดาห์ ซึ่งหากจะนับวันแล้วก็คงจะคิดเป็นการทำงานประมาณ 19 วัน ติดต่อกันโดยไม่มีวันหยุด!!

โหดมาก..แต่เราก็ทำสำเร็จ

แต่นั่นก็ยังเป็นแค่งานใน Phase แรก ..

แม้ว่าใน phase นี้จะยังไม่ support อุปกรณ์อย่าง smart phone กล่าวคือ อุปกรณ์มือถืออย่าง iPhone และ Smart phone นั้น ยังสามารถดูได้ เพียงแค่ไม่ได้มีรูปแบบและขนาดที่พอดีสำหรับ smart phone .. ไม่ได้เป็น responsive หรือเป็น mobile site เพราะด้วยเวลาอันจำกัดมากๆ แต่ feature นี้ กำลังเดินทางมาอย่างแน่นอน!

ยังมี features อีกมากมายที่รอจะ update ตามมาเร็วๆนี้

ซึ่งถ้ามี update เมื่อไหร่ ผมไม่ลืมที่จะมา update ใน blog72 นี้แน่นอนครับ..

สำหรับตอนนี้.. ลองเข้าเว็บ pf.co.th ดู version ใหม่นี้ไปก่อนนะครับ ^^

Search This Site:



rgb72 on Facebook

คำศัพท์ Internet วันละคำ

AdSense
– ระบบการโฆษณาบน Google
— WEB101 by rgb72

72's Friends

Useful Links

Related Articles: