Blognone Mobile สำหรับมือถือจอสัมผัส
reported by mk
FounderAndroidUbuntu
mk blog
10 Mar 2010 - 21:01
Announcement

ตามสมัยนิยมครับ เว็บอื่นมีกัน เราก็อยากมีบ้าง หลังจากทดสอบเป็นวงแคบๆ ใน Blognone Groups ได้สักระยะ ผมก็คิดว่าได้เวลาเปิดตัว Blognone Mobile อย่างเป็นทางการเสียที

ผู้ที่สนใจลองเล่น เข้าไปได้ทันทีที่ m.blognone.com

Blognone Mobile ออกแบบขึ้นมาสำหรับมือถือจอสัมผัสสมัยใหม่โดยเฉพาะ แนวคิดในการออกแบบมี 2 ประการ

  1. พยายามคง look & feel ของ Blognone ฉบับเต็มเอาไว้ รวมถึงความสามารถบางอย่างที่มีคนใช้ค่อนข้างเยอะ เช่น การอ่านและตอบคอมเมนต์
  2. ลดความซับซ้อนของหน้าเว็บลง ให้เหมาะกับหน้าจอสัมผัสมากขึ้น

แนวคิดทั้งสองมันขัดกันอยู่บ้าง ดังนั้นบางอย่างเราต้องเลือก ฟีเจอร์และข้อจำกัดของ Blognone Mobile ได้แก่

  • ออกแบบมาสำหรับจอ 320px ซึ่งเป็นความกว้างของมือถือจอสัมผัสส่วนใหญ่
  • ล็อกอินได้ คอมเมนต์ได้ แสดงคอมเมนต์ใหม่ที่ยังไม่ได้อ่าน เหมือนกับเวอร์ชันปกติ
  • เพื่อลดความซับซ้อนของเพจ คอมเมนต์จะถูกแสดงเรียงกันเป็น flat ไม่ใช่ thread อันนี้จงใจครับ
  • แสดงข่าวเฉพาะจากหน้าแรกหน้าเดียวเท่านั้น ถ้าอยากอ่านข่าวเก่าๆ ต้องใช้เวอร์ชันปกติเช่นกัน อันนี้ก็จงใจ
  • แถมไอคอนสำหรับวางบน Home Screen ของ iPhone

หน้าตาเป็นไปตามภาพ (ขอบคุณคุณ @poakpong สำหรับภาพและคำแนะนำ)

Blognone Mobile รุ่นนี้ถือเป็นรุ่นแรก มันยังไม่สมบูรณ์มากนัก ดังนั้นในระยะอันใกล้ เราจะยังไม่ detect user-agent เพื่อ redirect ไปยัง Blognone Mobile ครับ ให้ผู้ใช้เป็นคนเลือกเองไปก่อนว่าจะเข้าอันที่เหมาะกับหน้าจอของตัวเองมากที่สุด

ในโอกาสเดียวกันนี้ ผมมีคำถาม 3 ข้อ ที่อยากให้ผู้ใช้ Blognone Mobile ช่วยตอบ

  1. ฝากทดสอบบนมือถือและเบราว์เซอร์ที่ท่านใช้ การทดสอบเว็บไซต์บนมือถือเป็นเรื่องไม่ง่ายเลยเพราะเดี๋ยวนี้แพลตฟอร์มมันหลากหลายมาก ตอนนี้ที่ทดสอบไปแล้วคือ Android, iPhone (ขอบคุณ @poakpong), IE/Windows Mobile 6.1 (ขอบคุณ @ipats) และ BlackBerry (ขอบคุณ @fordantitrust) ยังต้องการตัวอื่นๆ อีกมาก โดยเฉพาะสายตระกูล Symbian/Maemo ไม่ว่าจะเจอบั๊กหรือแสดงผลได้สมบูรณ์ ช่วยตอบให้เห็นหน่อยในคอมเมนต์ โดยระบุระบบปฏิบัติการ-เบราว์เซอร์ที่ใช้ ถ้ามีภาพประกอบด้วยจะดีมาก
  2. ฟีเจอร์อย่าง Forum หรือ Poll ควรมีไว้ใน Blognone Mobile หรือไม่?
  3. ตอนนี้แนวทางการวางเนื้อหาในหน้าเว็บ แยกเป็น 2 ทาง คือ แสดงเฉพาะ headline แล้วให้ไปกดต่อกันเองถ้าอยากอ่านข่าวเต็ม กับแสดงข่าว+คำโปรย เหมือนกับเวอร์ชันปกติ แต่ละแบบก็มีข้อดีข้อเสียแตกต่างกันไป ปัจจุบันเพื่อความง่ายในการพัฒนา เราใช้แบบที่สอง ซึ่งก็มีผลเสียทำให้หน้าเว็บยาวพอสมควร คำถามคือสะดวกที่จะใช้แบบไหนมากกว่ากัน

สุดท้ายเผื่อหลายคนอาจยังไม่รู้ Blognone ยังมี PDA version ที่สนับสนุนโดย scriptdd ให้เลือกใช้ด้วยเช่นกันครับ

3,383 reads

Comments

nuntawat
WriterWindows PhoneSymbian
on 8 Mar 2010 - 09:27
nuntawat's image

โอ้ว ข่าวเราขึ้นเป็นรูปด้วย :D

เพิ่มเติม Blognone RSS บนมือถือ น่าจะลิงก์ไปยังหน้าเว็บมือถือนะครับ ไม่ควรลิงก์ไปหน้าเว็บพีซีครับ (เล่นบนซิมเบียน S60 FP1)


ดูเหมือนผมทำให้ที่นี่ครึกครื้นกับภาษาของผมมากเชียวนะ!!

lew
FounderAndroidSymbian
on 8 Mar 2010 - 09:43
lew's image

ผมว่า Blognone RSS ควรจะลิงก์ไปหน้าเต็มถูกแล้วครับ ไว้เราเปิดตัวส่วน Mobile เป็นทางการแล้ว (ทดสอบผ่านบน major platform) ถึงตอนนั้นเดี๋ยวจะมีการตรวจ user-agent เพื่อ redirect อีกที

nuntawat
WriterWindows PhoneSymbian
on 8 Mar 2010 - 09:48
nuntawat's image

อ๋อครับ


ดูเหมือนผมทำให้ที่นี่ครึกครื้นกับภาษาของผมมากเชียวนะ!!

Perl
ContributerWindows Phone
on 8 Mar 2010 - 10:17
Perl's image

โอ้ว ในที่สุดก็มีซักที.. ^^


ecution.style

jeno
Windows Phone
on 8 Mar 2010 - 10:28
jeno's image

ans#1
ทดสอบ Blognone Mobile บน Windows Mobile 6.5.5 จอ WVGA 800*480
Opera mobile 9.7 mode Mobile View
- http://twitpic.com/17adx9

ด้วย Opera mobile 9.7 mode Desktop View
- http://twitpic.com/17aei7

ด้วย Internet Explorer mode Mobile View/Desktop View (ผลออกมาเหมือนกัน)
- http://twitpic.com/17af65

สำหรับผม ดูด้วย Opera mobile ด้วย mobile view จะดีที่สุด ที่เหลือ font ล้นตกขอบจอ
แต่ปกติผมเปิด web บนมือถือด้วย Opera mobile desktop view อาจะลำบากบ้างหากต้องคอยสลับ

ans#2
คิดว่า ไม่จำเป็นต้องมี Forum หรือ Poll บน blognone mobile

ans#3
ชอบแบบที่สอง แสดงข่าว+คำโปรย ครับ

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 11:03
mk's image

ถ้าเป็น desktop view ก็คงต้องเข้าเว็บเวอร์ชันเต็มครับ น่าจะเหมาะกับงานมากกว่า

ส่วนรูปภาพประกอบก็ขอบคุณที่ช่วยส่งเข้ามาครับ

BlackMiracle
Android
on 8 Mar 2010 - 10:39
BlackMiracle's image

เคยลองมาก่อนหน้านี้แล้ว พอกดให้กลับ Full site มันไม่ยอมกลับ ตอนนี้ดีละ

moosaTAE
Symbian
on 8 Mar 2010 - 11:27
moosaTAE's image

ใช้ Browser ของ Symbian S60 V5 ตามแนวตั้งจอยังล้นด้านข้างอยู่ครับ

แล้วก็มีพวกลิงค์ Youtube ที่มันจะแสดงเป็นพื้นที่ว่างว่าง ๆ ไม่มีอะไรไว้ ทำให้เปลืองพื้นที่หน้าจอไปโดยปริยาย ถ้าเปลี่ยนเป็นแสดงลิงค์ไปยังคลิปแทนก็จะดีครับ

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 13:08
mk's image

มีภาพประกอบไหมครับ

Nozomi
ContributerAndroidSymbian
on 8 Mar 2010 - 20:07
Nozomi's image

ทำให้แทนละกันครับ

แนวตั้ง
P01

ขอบขวาที่เหลือในแนวตั้ง
P02

แนวนอน
P03

ขอบขวาที่เหลือในแนวนอน
P04

ผมกลับว่ามันเป็นปัญหาการตัดคำใน Symbian เองเสียมากกว่าที่จะเป็นที่ CSS นะครับ
เพราะข่าวของคุณ MK ก็จะอยู่ในกรอบพอดี ส่วนที่เป็นของคุณ Lew ที่เขียนติดกันเป็นพรืด ก็เลย ล้นกรอบออกมาอย่างที่เห็น จนเป็นขอบขวาที่เหลือครับ


รับบริจาคฉลากโภชนาการดู รายละเอียดที่นี่ ครับ

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 22:05
mk's image

ถ้าเป็นเรื่องตัดคำ ผมก็คงทำอะไรไม่ได้แล้วน่ะครับ (Android Browser ก็ไม่ตัดคำ) ยกเว้นให้ผู้เขียนข่าวทั้งหลาย ช่วยเคาะแบ่งวรรคกันบ่อยหน่อย

lawender
ContributerWindows PhoneSymbianUbuntu
on 9 Mar 2010 - 09:38
lawender's image

ผมเจอปัญหาเดียวกันบน Opera Mobile บน WM 6.5.3 ครับ
น่าจะไม่เกี่ยวกับเรื่องการตัดคำของ Opera เพราะเข้า www.blognone.com
มันก็สามารถแสดงผลได้ถูกต้อง ไม่ล้นไปด้านข้างครับ

Nozomi
ContributerAndroidSymbian
on 9 Mar 2010 - 13:49
Nozomi's image

แต่ผมเจอปัญหากับ Opera ตัวเต็มนี่แหละครับ

ทั้งตัว Mobile Site บน Opera ตัวเต็ม
Opera ดู mobile site

และตัว Full Site บน Opera ตัวเต็ม
Opera ดู Full site

ยื่นออกมาเหมือนกันเลย ถ้าผมบีบหน้าจอให้เล็กลงครับ ซึ่งถ้าเป็นใน FF มันจะตัดให้พอดีกรอบ


รับบริจาคฉลากโภชนาการดู รายละเอียดที่นี่ ครับ

mk
FounderAndroidUbuntu
on 9 Mar 2010 - 14:47
mk's image

อันนี้คงต้องแจ้งไปทาง Opera ให้แก้ปัญหาตัดคำน่ะครับ

MrWhisper
ContributerWindows PhoneSymbian
on 10 Mar 2010 - 14:18
MrWhisper's image

น่าจะทำได้นะครับ CSS3 พอจะช่วยตัดคำได้อยู่ (แต่ผมไม่แน่ใจว่าเบราเซอร์ของแอนดรอยด์รองรับหรือไม่)

moosaTAE
Symbian
on 8 Mar 2010 - 21:23
moosaTAE's image

ขอโทษทีไม่ได้โพสภาพประกอบนะครับ พอดียังไม่ได้ลงโปรแกรมแคปหน้าจอไว้
และขอขอบคุณ คุณ Nozomi ที่ช่วยโพสต์ภาพด้วยนะครับ

-orion-
SymbianUbuntu
on 8 Mar 2010 - 13:29
-orion-'s image

post on 5800 browser nokia
(symbian 60 v5)

-orion-
SymbianUbuntu
on 8 Mar 2010 - 13:36
-orion-'s image

แสดงผลใน 5800 (symbian 60 v5) ในแนวตั้ง เกิน size จอครับ ในแนวนอนพอดี
size จอ 5800 640x360

gotobanana
iPhoneAndroidSymbian
on 8 Mar 2010 - 13:43
gotobanana's image

in มากๆ

mementototem
Windows PhoneSymbianUbuntu
on 8 Mar 2010 - 14:46
mementototem's image

Poll น่าจะมีนะ แต่ Forum คงไม่ต้อง


My FingerSports Site

siamnotebook
on 8 Mar 2010 - 15:40
siamnotebook's image

HTC + Window Mobile 6 กับ IE

หน้าแรกอ่านได้ปกติดีครับ Font ไม่เพี้ยน จะมีนิดหน่อยก็ชื่อ Post ถ้าพิมพ์ติดกันยาวๆ จะไม่ตัดคำ

เข้ามาใน Post ก็อ่านปกติ

ส่วน Forum กับ Poll มีก็ดี แต่อย่าซีเรียสมากถึงขนาด แก้ระบบเว็บให้รองรับเกินไป เพราะปกติมือถือรุ่นใหม่ๆ รองรับเว็บที่ไม่มี Graphic หรือ Java หรือ Flash ได้อยู่แล้ว

xeroes
iPhoneUbuntu
on 8 Mar 2010 - 17:26
xeroes's image

มีลงใน app iphone ด้วยเหรอครับ

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 17:29
mk's image

เป็นเหมือน bookmark น่ะครับ คือมีแต่ไอคอน กดแล้วเป็นการเข้าเว็บปกติ

vaLVE
on 8 Mar 2010 - 17:50
vaLVE's image

ลองใช้บน opera mini 4.2 บน feature phone ธรรมดาอย่าง PIXON หน้าตาออกมาเหมือนกันกับเข้าหน้าเว็บปกติแล้วเปิดฟังก์ชัน mobile view ครับ แต่หน้าปกติแบบเปิด mobile view จะตัดคำให้เองอัตโนมัติ ส่วน m.blognone ไม่ตัดคำแฮะ ทำให้เข้าไปแล้วจะเป็นหน้า preview พร้อมกรอบของ opera mini ต้อง zoom in 1 ทีก่อน ส่วนความเร็วในการ pan ถือว่าเร็วกว่าแบบรู้สึกได้ครับ

ทดสอบแบบเร็ว ๆ ส่วนถ้าเวลาใช้งานจริงแล้วเป็นไง จะว่าอีกทีครับ

chayaninw
WriterSymbianUbuntu
on 9 Mar 2010 - 19:37
chayaninw's image

ใช้ Browser ของ Symbian S60 V3 บน Nokia E63 ครับ จอขนาด 240x320 แนวนอน

ความกว้างเนื้อหาพอดี ไม่มีเนื้อหาล้น แต่ตัวหน้ามันล้นออกไปเล็กน้อยตรงขอบ (เล็กน้อยจริงๆ) ทำให้ยังสามารถ scroll ด้านข้างได้ เดาว่าเป็นผลจาก scroll bar ที่ทำให้เนื้อที่แสดงผลไม่ถึง 320px เป๊ะ ไม่มีปัญหากับการอ่านเนื้อหา

ข่าวที่มีคลิป YouTube ตัวคลิปจะล้นเกิน 320px คลิปสามารถเปิดดูได้ตามอัตภาพของระบบมือถือ

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

shikima
AndroidSymbian
on 8 Mar 2010 - 19:01
shikima's image

Spica แสดงผลได้ดีครับ


CMDEVHUB

เขียนเอามันส์ ลองเข้าไปดูความมันส์ได้ครับ

Nozomi
ContributerAndroidSymbian
on 8 Mar 2010 - 20:23
Nozomi's image

Forum Poll Fullsite Login นี่จะไว้แบบนี้ก็ดีครับ

อย่างผม เข้ามาเพื่ออ่านข่าวเป็นหลัก ไม่ได้คิดจะทำอะไรมากกว่านั้น
โพลมีบ้าง แต่ไม่ใช่ประเด็นหลัก
ฟอรัมก็แทบไม่ได้ใช้ มีบ้างแต่ไม่ได้เข้า
login ใช้ครั้งเดียว

ปุ่มกลับมา Home ใช้ Logo ไปเลยก็ดีครับ

แต่ถ้าข้างล่างสุดมีปุ่ม สำหรับอ่านข่าวเก่าๆก็จะดีนะครับ แม้ว่าจะ จงใจให้ไม่มีก็เถอะ
หรือไม่อย่างนั้น ควรจะมี search box ให้ด้วย

ส่วนเนื้อข่าว ผมชอบ แสดงข่าว+คำโปรย มากกว่ามีแต่พาดหัว


รับบริจาคฉลากโภชนาการดู รายละเอียดที่นี่ ครับ

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 22:07
mk's image

ผมไม่คิดว่าการ search บนมือถือ เป็นวิธีหาข่าวเก่าที่ดีสักเท่าไรนะครับ อันนี้เป็นปัญหาของกูเกิล

แต่เรื่องข่าวเก่าๆ นี่ อยากอ่านสักแค่ไหนละครับ

Nozomi
ContributerAndroidSymbian
on 8 Mar 2010 - 23:29
Nozomi's image

เหมือนมานั่งทำ Usability test ให้คนอื่นเลย 555
(ของตัวเองก็ยังเขียนไม่เสร็จ)

สำหรับข่าวเก่า ผมให้ 2/5
topic ผมให้ 3/5
ค้นหา ผมให้ 2/5

แต่ถ้าคิดกลับกัน ถ้าอยากอ่านข่าวเก่าจริงๆ เข้า Fullsite
ก็ได้เหมือนกันนี่เนอะ


รับบริจาคฉลากโภชนาการดู รายละเอียดที่นี่ ครับ

retroboy
iPhone
on 8 Mar 2010 - 20:43
retroboy's image

เย้ๆ

willwill
ContributerAndroidUbuntu
on 8 Mar 2010 - 21:31
willwill's image

webOS SDK 1.4.0.42 ดูแล้วไม่น่าจะมีปัญหาอะไรครับ แต่ OS มันไม่รองรับภาษาไทยในระดับ engine

ปัญหาที่เจอคือ หน้า login ไม่ error เวลาใส่รหัสผิดครับ (หรือว่าขึ้นเป็นภาษาไทยไม่มีกรอบ?)

mk
FounderAndroidUbuntu
on 8 Mar 2010 - 22:09
mk's image

อันนี้น่าจะเป็นบั๊กครับ จดเข้ารายการเตรียมแก้ไขให้เรียบร้อย

NuttTaro
AndroidUbuntu
on 9 Mar 2010 - 00:34
NuttTaro's image

ลองใช้ android sdk เข้าดู ไม่มีฟอร์นไทย... หาวิธีลงอยู่






Golffy
ContributerBlackberry
on 9 Mar 2010 - 05:53
Golffy's image

ผมลองบน hTC Touch (จอ 240x320)
Windows Mobile 6, Opera Mobile 10
พบว่าขนาดฟ้อนท์เล็กมากจนแทบอ่านไม่ออกเลยครับ
ทำไงดีครับ (T-T)

lawender
ContributerWindows PhoneSymbianUbuntu
on 9 Mar 2010 - 09:41
lawender's image

+1
เป็นเหมือนกันครับ

mk
FounderAndroidUbuntu
on 9 Mar 2010 - 14:47
mk's image

เดี๋ยวจะลองแก้ที่ CSS ดูครับ

กึ่งยิงกึ่งผ่าน
Windows PhoneAndroidBlackberry
on 9 Mar 2010 - 11:05
กึ่งยิงกึ่งผ่าน's image

ใช้ Android เป๊ะมากครับ ตัวหนังสือโอเคไม่เล็กเกินไปครับ

DoraeMew
SymbianUbuntu
on 9 Mar 2010 - 14:30
DoraeMew's image

Opera 8.65 for Symbian บน UIQ3 เครื่อง Sony Ericsson G700
แสดงผลปกติดี

mrKaqz
iPhoneAndroid
on 9 Mar 2010 - 14:39
mrKaqz's image

น่าจะมีปุ่ม Next page ด้วยนะครับ

lancaster
ContributeriPhoneAndroid
on 9 Mar 2010 - 15:06
lancaster's image

HTC Hero (Android 1.5)


Sent from my computer

tekkasit
ContributerSymbian
on 9 Mar 2010 - 22:06
tekkasit's image

ตตตตต...ตัดคำ! เฮ้ย HTC Android นี่ตัดคำภาษาไทยได้ด้วยรึเนี่ย

BlackMiracle
Android
on 10 Mar 2010 - 12:38
BlackMiracle's image

สวยทีเดียวครับ

varavut
Windows PhoneUbuntu
on 9 Mar 2010 - 20:18
varavut's image

ผมทดสอบบน Windows Mobile 6.5.5 23544 บนเครื่อง Acer F900 ขนาดจอ 480x800 ครับ โดยใช้ Opera Mini 5 beta 2 ครับ
สามารถแสดงผลได้ค่อยข้างดี แต่มีบางบรรทัดเกินออกมาคาดว่ามาจากการที่ opera ตัดคำไทยไม่ได้
http://farm5.static.flickr.com/4025/4418863571_c2f2f48bee.jpg

ปล.ผมใส่รูปไม่เป็นครับ

shaclow
Windows Phone
on 10 Mar 2010 - 06:33
shaclow's image

Blackberry browser ก็แสดงผลหน้าแรกถูกนะครับ แต่พอคลิกมาอ่านเนื้อข่าวแล้วมีรูปยื่นออกมานอกกรอบครับ


People NEVER change. I cannot change also ...

mk
FounderAndroidUbuntu
on 10 Mar 2010 - 10:23
mk's image

มีภาพประกอบไหมครับ

xxovoxx
on 10 Mar 2010 - 14:30
xxovoxx's image

สนใจเอา Code ผมมั๊ยครับ

ภาพตัวอย่าง

mk
FounderAndroidUbuntu
on 10 Mar 2010 - 16:06
mk's image

ผมไม่มี iPhone ทดสอบน่ะครับ ตอนนี้พลเมืองชั้นหนึ่งมีตัวเดียวคือ HTC Magic ส่วนที่เหลือเป็นพลเมืองชั้นรอง (แต่ก็จะพยายามรองรับให้ได้มากที่สุดนะ)

xxovoxx
on 10 Mar 2010 - 17:23
xxovoxx's image

เว็บผมไม่ต้องใช้ iPhone ก็ดูได้เหมือน iPhone ครับ
ใช้ Google Chrome หรือ Safari แล้วเข้าเว็บ http://webappiphone.com/blognone/
และย่อหน้าเว็บให้ได้ขนาดเท่า iPhone 320x480 หรือเทียบ Size กับรูปที่ผม Upload ไว้ครับ