it-swarm.asia

Apa cara yang baik untuk menampilkan komentar bersarang tak terbatas?

Apakah ada cara untuk melakukan utas komentar bersarang tanpa batas dengan cara yang tidak terlihat mengerikan? Saya menyadari bahwa seseorang hanya dapat membatasi tingkat sarang, tetapi mungkin ada cara yang lebih baik untuk menunjukkan beberapa komentar sebagai balasan untuk komentar lain daripada hanya membuat indentasi komentar. Setelah level tertentu dari sarang, indentasi gagal.

Beberapa ide untuk dimainkan: warna, ukuran, pengungkapan progresif, angka (1.1, 1.2, 1.2.1, dll), modal windows, aliran balasan komentar (seperti Facebook atau Twitter), sesuatu seperti SeaDragon , dll.

Adakah yang memecahkan masalah ini? Apa yang kamu lakukan? Saran dan contoh visual yang out-of-the-box diterima juga.

34
Virtuosi Media

Tidak terlalu sulit jika Anda memperlakukan "komentar bersarang tak terbatas" sebagai dimensi lain dalam desain Anda. Kebanyakan utas komentar hanya memiliki dua dimensi: komentar (X = 1) dan jumlah komentar (Y = N). Tapi sekarang Anda memiliki komentar bersarang, menambahkan Z = M ke dalam campuran.

Dari sudut pandang desain UI ini seharusnya tidak mewakili banyak tantangan karena ada banyak paradigma untuk berurusan dengan dimensi ekstra, seperti yang dijelaskan Pam, serta tab, panel, dll. Masalah yang kita hadapi dalam dunia nyata adalah bahwa tidak ada ruang layar tak terbatas atau kekayaan tak terbatas tersedia. Di situlah segalanya menjadi rumit: pengguna web tidak ingin menggulir ke kanan, dan sebagian besar kotak komentar dikenakan bilah gulir halaman induk tanpa menjadi mandiri.

Twitter untuk iPad

Twitter untuk iPad baru-baru ini memberi saya beberapa inspirasi di bidang ini. Di sana, dimensi Z disajikan secara interaktif sebagai panel overlay di atas X, Y:

Twitter for iPad

Karena Anda menggunakan iPad, Anda memiliki kontrol penuh untuk membawa panel tambahan itu untuk tampilan penuh atau tidak. Jadi membaca tweet (daftar X, 2-dimensi 2-dimensi) tidak apa-apa: gulir ke atas dan ke bawah. Sebagian besar aplikasi Twitter tersandung ketika mencoba menambahkan dimensi ke-3, yang diperbesar menjadi Tweet untuk melihat konteksnya.

Misalnya, Tweet dapat menjadi balasan untuk orang lain, dan dalam kasus tersebut Anda ingin melihat percakapan lengkap. Sebagian besar klien Twitter berbasis web akan memuat halaman baru. Sebagian besar aplikasi tidak akan mendukungnya. Tetapi Twitter untuk iPad hanya membawa panel kanan itu lagi dan menyoroti Tweet yang dipilih di panel asli. Sekarang Anda dapat membaca daftar apa pun yang ada dalam konteks secara vertikal. Pada titik ini, Z = 1. Jika Anda mengklik item dalam daftar ini, panel lain masuk dari kanan dan Anda berada di Z = 2.

Secara teori, ini dapat berlanjut untuk Z = M, meskipun saya tidak yakin apa yang dilakukan klien Twitter itu sendiri (mungkin macet!). Model ini terlihat menarik.

15
Rahul

Anda benar, indentasi gagal setelah sejumlah level tertentu, tetapi Anda selalu dapat mencari solusi seperti apa deviantArt tidak (setelah sekitar 10 level, mereka mengarahkan Anda ke halaman lain dengan keseluruhan balas aliran).

Saya lebih suka mencari perubahan ukuran font atau panel pengelompokan. Inilah gambar tentang apa yang saya bicarakan. Ini lebih sederhana dan saya pikir itu menyelesaikan pekerjaan. Facebook sebenarnya melakukan campuran keduanya di halaman Umpan Berita. Gagasan utama adalah untuk menunjukkan mereka dengan jelas, dan pada saat yang sama menunjukkan yang merupakan komentar utama yang memulai rantai balasan. alt text

Memperluas subjek panel (karena saya pikir Anda benar tentang masalah ukuran font), Anda dapat membedakan kelompok komentar dengan warna. Masih perlu indentasi, tetapi perlu jauh lebih sedikit, yang memberi Anda ruang untuk tingkat sarang yang jauh lebih banyak dan masih membuatnya jelas. Anda mungkin ingin memikirkan kembali tautan yang mengarah ke halaman yang berbeda setelah sekitar 6 level.

alt text

14
Pam Rdz

UE dalam diri saya harus bertanya: Pembicaraan seperti apa yang membutuhkan komentar bersarang tanpa batas?

Apakah mereka benar-benar harus bersarang tanpa batas? Pertimbangkan mode percakapan Gmail - itu hanya mengelompokkan semua balasan ke percakapan dalam urutan kronologis. Tampaknya bekerja dengan cukup baik - tidak berubah selama bertahun-tahun. Satu-satunya keluhan yang dimiliki orang adalah beberapa menginginkan 'pandangan yang tidak ditelusuri' tetapi ini jauh dari apa yang Anda sarankan.

8
Julian H

Saya telah mendekati masalah ini, dengan tidak membuat indentasi, dalam beberapa situasi, dan menggunakan panah untuk menunjukkan komentar mana yang membalas komentar mana.

Inilah contoh, dari sistem diskusi sumber terbuka Saya sedang mengembangkan:


Indicating which comment replies to which comment, via arrows


Berikut ini tautan ke contoh di atas, dalam kehidupan nyata: http://www.debiki.com/-71cs1#post-116979

(Saya juga menulis artikel blog tentang ini: http://www.debiki.com/-01jn7-solving-problem-nested-replies-indentation )

8
KajMagnus

Saya memikirkan satu yang agak terinspirasi oleh MS Outlook 2010 - pengelompokan percakapan:

Tampilkan hanya komentar "LEAF", masing-masing berisi semua komentar sebelumnya di baris percakapan itu.

Misalnya, pertimbangkan struktur "kehidupan nyata" berikut:

Post
 - Comment1
 - Comment2
   - Comment2.1
   - Comment2.2
     - Comment2.2.1

Apa yang akan dilihat pengguna adalah:

Post
  - Comment1
  - Comment2.1
  - Comment2.2.1

Ketika melihat Comment2.2.1, misalnya, pengguna akan melihat:

Comment2.2.1 by UserX 

     I agree!

Comment2.2 by UserY

     I think this should be done so and so

Comment2 by UserZ

     This post has a call for action, what do you think?

(Sementara Comment2.1 juga akan berisi Comment2)

5
Dan Barak

Saya pikir saran dari Dan hanya menunjukkan satu komentar dan leluhurnya sangat masuk akal. Hal ini memungkinkan seseorang untuk melihat pesan dalam konteks percakapan yang mengarah padanya tanpa gangguan cabang yang tidak relevan.

Awalnya sebuah posting dapat ditampilkan seperti ini:

+-------------------------------+
| The Design of Everyday Things |
| by Don Norman                 |
|                               | 
|                   [3 comments]| 
+-------------------------------+

Mengklik [3 komentar] atau menekan tombol panah bawah akan membuka komentar pertama di bawah posting.

+-------------------------------+
| The Design of Everyday Things |
| by Don Norman                 |
|                               |
|                               | 
+-------------------------------+
|                     1 of 3 [x]| 
|                               |
|< That's a great book!        >|     
|                               |
+-------------------------------+                     

Dari titik ini, Anda dapat menggilir semua komentar yang ditulis tentang pos, baik menggunakan tombol panah atau tombol panah kanan dan kiri. (BTW, setiap kali saya mengatakan tombol panah, mudah untuk membayangkan hal yang sama dengan gesekan layar sentuh, kemiringan accelerometer, joystick, trackball, dll.)

Katakanlah Anda langsung membaca komentar berikutnya:

+-------------------------------+
| The Design of Everyday Things |
| by Don Norman                 |
|                               |
|                               | 
+-------------------------------+
|                     2 of 3 [x]| 
|                               |
|  I want to read this one.     |
|< I've read his other two.    >|     
|                               |
|                   [8 comments]|
+-------------------------------+  

Pada titik ini, Anda berada di komentar yang memiliki delapan komentar. Anda dapat turun satu level dan membaca komentar itu.

+-------------------------------+
| The Design of Everyday Things |
| by Don Norman                 |
|                               |
|                               | 
+-------------------------------+
|                     2 of 3 [x]| 
|                               |
|  I want to read this one.     |
|  I've read his other two.     |     
|                               |
+-------------------------------+  
|                     1 of 8 [x]| 
|                               |
|  I enjoyed this one and       |
|< Emotional Design. I didn't  >|
|  know there was a third.      |
|                               |     
|                   [2 comments]|
+-------------------------------+

Dan seterusnya. Secara teori, akan mudah untuk mengikuti semua cabang (atau hanya yang menarik) tanpa kehabisan ruang, memperbesar dan memperkecil seperti yo-yo, mencoba untuk menjaga tumpukan percakapan di kepala Anda, atau melupakan cabang apa sudah dikunjungi.

Juga sepele untuk menyimpan, membookmark, atau mencetak komentar tertentu; konteksnya akan secara otomatis dimasukkan.

5

Pada titik tertentu, Anda harus membatasi pengguna ke level bersarang. Jika Anda mengizinkan pengguna untuk bersarang tanpa batas, pada titik tertentu (biasanya sekitar 3-4 level), konten komentar asli tidak lagi relevan dengan apa yang terjadi di level yang lebih dalam.

Perlu juga dicatat bahwa jika bersarang secara manual dibatasi pada beberapa level tertentu, orang masih akan mencari cara untuk membuat sarang secara artifisial, seperti menggunakan @balasan dan mengutip orang lebih jauh di rantai percakapan.

1
Jason

Lihatlah slashdot.org. Reddit.com juga. Sistem komentar mereka berjalan cukup dalam (setelah Anda menghapus pemfilteran).

Bagaimana? Saya berasumsi, akan ada sesuatu di sepanjang pendekatan yang sama diambil ketika memperluas sistem folder di OS. Orangtua-> Hubungan anak. Saya belum berlari melintasi batas seberapa dalam struktur folder di windows bisa pergi, tapi itu tidak benar-benar rumit ketika Anda memikirkannya.

Tampilkan "balasan teratas" (Pertama, terbaru, berperingkat terbaik, apa pun). Tampilkan balasan ke Atas. Apakah Balas ke atas punya balasan?

Saya juga berpikir Phonescoop.com (Klik misalnya dengan balasan) memiliki model yang menarik: Balasan disembunyikan setelah titik tertentu, tetapi Anda dapat menggali percakapan lebih dalam dan menjaga hierarki.

Ketika Anda membandingkan Slashdot dengan Phonescoop, lebih mudah untuk kehilangan pandangan tentang hierarki di Slashdot, tetapi Anda harus lebih banyak mengklik pada Phonescoop. Slashdot juga menggunakan semakin sedikit ruang saat Anda semakin dalam (saya yakin itu berhenti di beberapa titik dan mereka semua terjepit bersama atau hanya berbaris polos) ..

Beberapa situs tidak perlu bersarang dalam. Situs ini misalnya. Tata letak meniadakannya. Situs yang mengandalkan komentar pada komentar lain memohonnya. Pertanyaannya adalah, berapa banyak kegiatan yang Anda anggap jujur? Dan bagaimana Anda bisa mempresentasikannya dengan cara yang bermakna.

1
WernerCD

Ini adalah masalah yang sulit untuk dipecahkan, yang juga membuat puzzle yang menarik. Jika Anda tidak membatasi tingkat sarang, Anda perlu sesuatu yang akan berulang tanpa merusak sarang. Penentuan posisi (indentasi) ketika dilingkarkan akan mengacaukan konteks hierarki.

Saya telah bereksperimen dengan warna, dan saya pikir solusinya dapat ditemukan di sana, mungkin.

Sulit, karena solusi perulangan tidak dapat memiliki status hierarki apa pun, karena ketika dilingkarkan akan 'reset' dan Anda akan kehilangan konteks. Jadi solusinya akan perlu memiliki status hierarki sementara.

Ada yang mengambil?

1
Løvskogen

Ini adalah masalah NP-hard.

Anda dapat memecahkan masalah ini, tetapi tidak pernah tahu (atau mengatakan) dengan pasti apakah itu efisien atau tidak.

0
kmonsoor