Ноутбуки - 15 Березня 2011 - Новини зі світу ІТ українською мовою

Мій сайт

Головна
Реєстрація
Вхід

Головна » » Ноутбуки

23:00

Ноутбуки

Самий простий, здавалося б на перший погляд, тип інтернет-магазинів. Згоден, їх ставок гати. Але саме на його прикладі простіше за все показати, що я маю на увазі. Хоча інші магазини не менш актуальні.

Отже, головна сторінка виведення товарів. Що важливо - можливість простій та зрозумілій сортування і відображення товарів. Також можливість вибрати, що саме цікавить (групу товарів).

Ноутбуки

Є блок, у нього є три основні зони: навігація, контент, лістинг (пейджинг). Давайте їх розберемо.

1 - Навігаційна панель. Її можна відразу розділити на 3 частини: група товарів, сортування, метод виведення / показу.

Група товарів: користувач може сам визначити що йому необхідно. Наприклад, він хоче, щоб в цьому блоці відображалися тільки ноутбуки, або ноутбуки й батареї чи ще що-небудь.

Група товарів: на даному скріні видно, що обрана група «Ноутбуки», а поруч ледве видна іконка (ну, мені нічого в голову не прийшло, крім як поставити саме цю іконку :)) Для чого вона потрібна? Щоб вибрати групу товару, що відображається в цьому блоці.

Ноутбуки

Сортування. Знову ж таки, користувач має можливість вибору, і досить зручного. Ну, а посилання «Склад» і «Акція», думаю, і так зрозуміло, і без попап ... хоча «Акції» теж можна ділити за типом ... Але це вже реально не потрібно.

Більш того, якщо на сайті є рекламні блоки на зразок тієї ж розетки ...

Ноутбуки

... то чому б не дати користувачеві можливість вибирати тематику рекламних блоків? Скажімо, один блок залишити не контрольований, другий з можливістю зміни тематики. Якраз великий блок (де багато картинок по черзі) я б віддав на вибір користувача.

2 - Контент в блоці. Як видно, є 3 види відображення, 1-й і 2-й - одне і те ж по суті справи, вони відрізняються тільки розміром ітемов (товарів) для зручності. Давайте розглянемо їх.

Висновок кубиками (не знаю навіть, як вірно назвати):

Ноутбуки

Маленькі іконки на товарі, що вказують на додаткові опції - то чи буде це акція, чи то це відсутність на складі. Або те, що це лідери продажів, або ще що-небудь. Насправді, це левова частка роботи для грамотного дизайнера. + Доречний розділ «Допомога» на сторінках інтернет магазину. Можна робити їх не маленькими, якими завгодно.

При натисканні на товар ми бачимо наступне: важливі подробиці товару і, знову ж таки, іконки ... іконки ... іконки ...

Ноутбуки

До речі, не можу не сказати ущипливо, блін, огидно виглядає, коли на сайті ціна виділена _красним_ (відлякує) кольором!

4 сірих іконки припускають швидкий доступ до перегляду тієї чи іншої інформації про товар. Приміром, там, де шестерінка - тих. опис, фото-іконка - відповідно, фото. Відео ... Дивно, але я до сих пір не розумію, чому на сайтах немає відео? У наш час «саме те» користуватися відео контентом! Що б ти не продавав! Хороший приклад подачі інформації у Дорохова, а саме тут! Відео досить добре підстьобує до покупки. До того ж відео дає некволе уявлення про пропорції і частково витісняє необхідність у тактильних відчуттях, а кожен, хто продавав коли-небудь що-небудь, знає, як це важливо!

Але повернемося до нашого магазину. Третій висновок товарів - це табличний висновок. Я використовував ту ж компоновку, що і при натисканні на товар у попередньому варіанті.

Ноутбуки

3 - Також важливий момент те, що я думав над концептом дизайну і-магазину, який не має скролл браузера. Тобто, тупо у вікні браузера. Але потім відкинув цю ідею, але один з елементів залишився, і ви швидше за все помітили його, але не зрозуміли, навіщо він потрібний. Це лістинг (пейджинг) сторінок з товарами. Він потрібен з однієї простої причини. Товарів багато, і перегортати їх потрібно, але скільки я вже ні цікавився, у кожного знайомого запитував, у багатьох покупців в інтернет-магазинах, спостерігав за своїми знайомими ... Вертикальний список - люди мимоволі не звертають увагу на нижні позиції. Все-таки краще, щоб список товарів уміщався в полі зору. Але знову ж таки, це не підтверджено на 100%, просто спостереження, і занадто мало людей (кількості спостереження їх поведінки) для нормальний статистики.

А пейджинг все-таки потрібен, тому як на головній сторінці сайту можна розмістити не 1, а 2, або 3-4 блоку.

Ноутбуки

Ось так я це бачу. :) Але і в цьому є хитрий задум, який я розкрию пізніше, коли підійдемо до розбору головної сторінки і корзини. А зараз - перегляд одиниці товару.

Вид окремої одиниці - це дуже цікава штука. Справа в тому, що якщо це вид дріб'язкової дрібнички, наприклад, перехідника HDMI to VGA, то, звичайно ж, нічого абсолютно винаходити не потрібно. Галерея фоток? Навіщо? Тобто, все просто: висновок однієї фотки, опис і ціна. Навіть ілюструвати нічого толком ... А ось висновок, наприклад, одиниці ноутбука ... То тут вже крути-не крути, а хочеться подумати, як і що.

Ноутбуки

Насправді все досить прозаїчно і все вирішується на рівні дизайнера. Все просто. Є фотка товару, є невелике (!) Маркетингове опис, а під ними вже мініпанелька. Ціна, «до кошика» та іконки: їх можна замінити табами, та чим завгодно. Все, що потрібно людині, є відразу. Хочеться копнути глибше? Будь ласка, є іконки / таби, вивчайте. Але ... Є ще один момент.

Акційна інформація - досить важлива річ, тому що вона є додатковим стимулом до продажів. І її досить грамотно в даному випадку було б помістити вгору, вище всього іншого.

Ноутбуки

Але була в мене думка висловити акцію по-іншому. Додати сумку без ціни або з ціною в 0 гривень, як зовсім подарунок до товару.

Ноутбуки

Ну от, тепер можна розглянути макет головної сторінки або ще трохи про інтерфейс магазину.

Ноутбуки

Як ви бачите, на верхній панелі праворуч є можливість додавати вітрини, блоки з контентом. Ось саме тому мені у цьому концепті знадобився пейджинг, хоча, знову ж таки, все відносно. Тому як користувачам це може бути не потрібно, а може бути просто-напросто не так важливо ... У будь-якому випадку, є можливість їх додавати.

А тепер трохи про кошик. Справа в тому, що я ні як не можу второпати, навіщо ж у кошиках інтернет-магазинів, причому поголовно, застосовується проста конструкція перерахунку?

Ось самі подумайте, навіщо? Враховуючи специфіку товару, наприклад, візьмемо фотоапарати професійні чи ноутбуки. Це досить дорога техніка. Ну от кому, зайшовши в кошик оформляти замовлення, прийде в голову раптом замовити 5-10 лептопів? Та нікому! Упевнений на всі 100, так як попрацював в продажах. І корпоративний сектор завжди веде переговори в живу, якщо мова йде про велику кількість. Але! Хтось обов'язково та й заперечить, мовляв, нехай навіть і не користуються, але можливість повинна бути! І я з цим погоджуся, але, знову ж таки ... Ніхто не буде купувати 10 лептопів, або 5 дорогущих про-фотоапаратів! Розумієте, про що я?

Що я пропоную на противагу цьому? Все просто ... "+" - так-так, звичайний плюсик. Далі я проілюструю це при розгляді кошика.

Кошик. Я щиро не розумію, навіщо робити окрему сторінку для корзини. Комбінований варіант: я б зрозумів, якщо товарів у кошику більше, наприклад, 10 - то перехід на окрему сторінку. Але, знову ж таки, рідко я таке зустрічав, працюю в інтернет-магазинах та з інтернет-магазинами.

Ноутбуки

Як видно, все досить просто, "+" - додати той же самий товар, "-" видалити. І користувач може додавати скільки завгодно таких товарів. Просто біля товару з'явитися невелике позначення кількості.

Ноутбуки

Ось так нібито досить просто, і в той же час все необхідне є. Але я свідомо не сказав на одній деталі ... На початку посту я говорив про спосіб подачі інформації, що кожному товару свої нюанси виводу. От мені цікаво, чи виник у кого-небудь питання з приводу виведення товарів кубиками, при натисканні, і таблично? :)

А суть-то взагалі-то ось в чому. Повторюся: кожному виду товарів свої нюанси виводу. Зауважте, я вибрав магазин ноутбуків.

І що ми бачимо на цій ілюстрації?

Ноутбуки

Як на мене, ми бачимо досить грубу маркетингову помилку. Чому? Знову ж таки, нюанси специфіки товару. Це магазин ноутбуків. Що важливо знати покупцеві, навіть якщо він сам в цьому не сильно зацікавлений, але що його може зачепити? З досвіду скажу, що серйозно чіпляє живучість батареї. І в блоці на ілюстрації вище є дані про процесор, про пам'ять, жорсткому диску і коннекторах. Так, на це теж звертають увагу, але батарея і розмір екрана все одно чемпіони як критерії вибору. Як не крути. Тому більш прийнятний вид був би такий:

Ноутбуки

Погодьтеся, це відразу кинеться в очі і це реально потрібно покупцеві ноутбука. Це одна з найважливіших деталей при виборі ноутбука - батарея.

Післямова

Вже чув від сеошників, що багато Аякса і т.д. шкідливо, чув купу скептичного з приводу того, що подібне мегазатратно у розробці і т.д. Але! По-перше, це не так. А по-друге, прошу ще раз зважити, що це поки що тільки мої думки, але частково вони всі були вже реалізовані в роботі. І там, де я помічав підвищення конверсії, я став замислюватися про цей концепт взагалі.

Як ви напевно помітили, я приділив мало уваги окремій сторінці виведення одиниці. Але це не так. У наступному пості на прикладі сторінки ноутбука, сторінки фотоапарата я розповім, як можна оформити висновок інформації більш зручним способом, і також на цих прикладах розповім, як можна використовувати інфографіку і чому я взагалі рекомендую її використовувати.

Так само в наступному пості мова піде про ще один важливий для інтернет-магазинів моменті: сторінки порівняння товарів. Тому що я ще не зустрічав нормального механізму порівняння товарів і хотів би поділитися своїми ідеями з цього приводу.