Робота над сучасними сайтами

Олег Слюсарчук

Опубліковано: 06-06-2016

Розділи: Онлайн - журналістика.

0

Про роботу над створеннями Інтернет-ЗМІ, основні «підводні камені» та кола веб-дизайнерського пекла для студентів кафедри нових медій розповів дизайнер та ілюстратор Олег Слюсарчук.

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

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

Все в цьому світі рахується, все звідкись береться і нікуди не зникає.

У світі зараз активно продовжується тотальна діджиталізація всього, що можливо і неможливо. І всі ці речі мають великий вплив на маси, і чим раз, тим більше замінюють ті чи інші частини нашого життя, в тому числі і ЗМІ.

Які ж підходи ми використовуємо при роботі з будь-якими діджитал-проектами? З чого почати? Здавалося б, нічого складного – є замовник, який собі щось придумав, він знає, яка в нього проблема, знайшов компанію, яка виконуватиме його запити, найняв дизайнера і каже: «Сиди, рисуй. А я тобі розкажу, як правильно жити». Дизайнер сідає, рисує, все робиться, в це все вкладаються гроші, випускають проект – і, здається, щось пішло не так. Бо хтось думав по-одному, а реальність зовсім інша.

І от починає здаватись, що купа витрачених грошей не окупились, і незрозуміло, чому саме. Сидимо і думаємо: чому все так сталось? Що треба було робити з самого початку?

Ми завжди починаємо працювати з двох частин: перш ніж до чогось братись, потрібно з’ясувати дві сторони. Перша – це бізнес-сторона, друга – сторона користувача. Ми їх називаємо збором business-requirements і збором user-requirements. Зазвичай, перед початком будь-якої роботи над цифровим проектом працює так звана «фаза discovery» – це період часу, щоб ознайомитись з проблемою, щоб ми зрозуміли, що ж нам робити, суть проблеми, яку потрібно вирішити та чому вона взагалі виникла. Тому спочатку ми сідаємо і говоримо з людьми, які пояснюють, яка в них проблема та звідки вони про неї знають.

Якщо повернутись до ЗМІ, то перш за все нам потрібно з’ясувати, яка інформаційна політика редакції, яке інформаційне наповнення, комерційне призначення і решту необхідних для роботи речей. Наприклад, як зрозуміти комерційне призначення? Ніби все ясно: люди читають сайт, продають там рекламу, платять гроші. Чим більше грошей заплатять за рекламу, тим більше отримають журналісти, розширюватиметься штат і т.д. Однак насправді не все завжди буває так просто, завжди є купа підводних течій, які видно далеко не відразу. От ти все зробив, все класно, а вони й кажуть: «Ой, знаєш, все добре, але тут є дозавантаження, а нам це не підходить». Дивуєшся: це ж зручно для користувача! Але виявляється, якщо, наприклад, сторінка не буде перевантажуватись, то і не перевантажуватимуться рекламні банери, не завантажуватиметься нова реклама, і замовник  втрачає гроші.

Щодо реклами, тут є один важливий момент – не завжди комерційна сторона реклами є грішми. Наприклад, якщо порахувати собівартість банерів, які розміщені на інформаційних ресурсах і як це відображається на їхній відвідуваності, то виходить, що сумарно всі банери в місяць приносили дохід заледве в 1000 гривень. А шкода, яку вони робили для користувача, було в рази більше. Так само, як були різноманітні приклади з тим, що не ефективніше перезавантажувати рекламу чи визначати для неї якесь певне місце, а те, щоб певний банер був на конкретному місці – і не важливо, скільки платить замовник чи ефективність місця розташування, а важливо, щоб, приміром, Василь Васильович бачив Івана Івановича, і на цьому вся комерційна успішність проекту закінчується.

Повернемось до етапів розробки. Далі нам потрібно визначити мету і цінності проекту. Здавалося б, яке це має відношення до розробки? Платять гроші – то й роби!

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

В нашому бізнесі є кілька моделей співпраці із замовником. Перша – це так званий outstaffing, це модель, де замовник платить просто за працівника. Другий варіант – outsourcing, тобто коли тобі дають якусь частину інформації для розуміння бізнесу клієнта чи партнера, але ти маєш тільки частковий вплив на ту чи іншу роботу.

Є ще варіант solution – це коли ви працюєте як консалтинг. Ви займаєтесь аналізом бізнес-партнера, його ІТ, розумієте, де у них прогалини, намагаєтесь зрозуміти, звідки вони взялись та як їх закрити. Ви працюєте на одному рівні з партнером та зі своєї сторони розвиваєте бізнес.

Коли ви працюєте з місцевими ЗМІ, то намагаєтесь зрозуміти їхню ситуацію, проаналізувати її та пояснити, які є проблеми та як їх усунути. Але, нажаль, все завершується тим, що вам платять гроші та примушують вирішувати проблеми, яких ви не розумієте. І, відповідно, результат виходить такий, що от вам замовили, ви зробили, запустили, а люди далі якось з цим працюють.

Тепер перейдемо доuser- requirements. Що це таке? Це збір абсолютно всіх даних про вашу аудиторію. Як ми це робимо? Першим підходом є впровадження юзер-інтерв’ю. Ми намагаємось зрозуміти, хто буде працювати із системою, як, для чого. Це потрібно для правильної побудови завдання, щоб зрозуміти, як вони працюють кожного дня та де в них є якісь проблеми.

Далі ми створюємо так звані«персони», які нам будуть потрібні протягом всієї роботи. Що таке персона? Це набір характеристик, які притаманні ролі користувача проекту. Наприклад, у веб-сайті ЗМІ є, як мінімум, дві ролі: адміністратор і читач. Якщо піти далі, то є людина, яка створює доступи, акаунти журналістам в адмінці, а є люди – просто журналісти, – які приходять, скидають якісь матеріали. Зі сторони читача десь так само вийде: читач як представник аудиторії, читач з правами коментування, читач з правами блогера і т.д.

Після цього створюють так звані «юзкейси» і «юзерсторі». Це розуміння поведінки користувача. Як є, так і записують: «Я, як користувач А, хочу зробити дію В (чи отримати результат С), і для цього мені потрібно…». І таким чином, живучи з вашими ролерами, розуміючи їхні кроки та що вони будуть робити, створюються технічні вимоги. Вони не беруться з того, що придумав собі редактор, не копіюються з того, що є, приміром, в інших ЗМІ. Все береться з того, як та чи інша роль буде себе поводити. І саме таким чином ви збираєте технологічні рішення.

Для чого це все створюється, і навіщо робити такий складний шлях? Такий довгий шлях життя користувача ми проходимо, щоб побудувати інформаційну архітектуру проекту. Моделі архітектур бувають різними: є простіші і складніші, більш впорядковані і менш структуровані. Всі технологічні вимоги будуються на основі інформаційної архітектури, а вона, у свою чергу, береться з того, як ти проживаєш з користувачем його щоденну роботу і розумієш, як це перенести в технологічну допомогу. Однак на практиці завжди ці всі речі проходить людина, яка, в принципі, не працюватиме на проекті, який планується. І коли вона повертається, то завжди є купа поправок. І для того, щоб процеси перероблення і затвердження не тривали вічність, насамперед потрібно чітко і ясно зрозуміти, що кому потрібно. Це основа адекватної співпраці. У великих комерційних проектах ці процеси тягнуться довго, але при цьому допомагають економити кошти.

Пропоную тепер перейти до visual design. Кожному здається, що щоб зробити прекрасний візуальний дизайн, то потрібно вміти працювати в графічних редакторах і вміти «креативно» мислити. Насправді все набагато банальніше – для успішного дизайну потрібно володіти лише кількома елементами. Ц е лінія, фігура та її пропорції, значення контрасту, колір  (зокрема теорію кольорів), текстура, розмір (він визначає все в позиціонуванні елементів).

До речі, щодо кольорів – коли ти робиш будь-який продукт, який пов’язаний з веб, то всі ці питання щодо кольорів, креативності подачі та решти подібного, то це не є варіанти художньої думки, а питання потрібно це, чи ні. Дизайн – це не підхід до краси, дизайн – це вирішення задачі. Нема понять «гарно» – «не  гарно», а «вирішене питання» чи «не вирішене». Наприклад, чому в інтернет-медіях не використовують фіолетовий колір?  Все дуже просто і банально, це колір відкритих активних лінків у браузері. Якщо є в елементах щось червоне – це завжди помилка, error. Не проблема в красі кольору чи якогось суб’єктивного ставлення – це повинен бути такий варіант, щоб він, не мішав та не створював якихось казусів, про які я вже розповів.

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

Контраст – це дуже важлива річ. Контраст є не тільки в кольорі, це теж напрямок і протиставлення фігур. Наприклад, чому зараз так повелось, що на багатьох сайтах фотографії авторів статей круглі, хоча самі фото прямокутні? Це не просто через те, що якомусь дизайнеру так захотілось, це контраст між показом контентних фотографій та фото авторів.

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

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

Групування елементів є також дуже важливою річчю, їх складають в групи, щоб створити візуальну сітку для читача.

Якщо взяти всі елементи, про які я розповів і скласти їх разом, то це і буде створення контентно-інформаційної частини. Чому одні проекти виходять красивими, а інші – ні? Бо одні розробники дотримуються правил, а інші їх порушують, от і все.

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

Стратегія для будь-якого стартапу одна: досліди – збудуй – потестуй – вивчи –досліди, як виправити. Всі великі компанії працюють таким чином. І навіть якщо ви пробуватимете працювати точно так само, як інші, вже успішні ЗМІ, то ніхто не дає гарантій, що ваша робота буде такою ж успішною, адже оця складова дослідження у вас все одно буде інакшою, а вона є визначальною при запуску проекту. Тут не можна просто взяти і повторити або вчитись на чужих помилках – в тебе є твоя аудиторія, в тебе є твої задачі і твої кола пекла, які потрібно пройти, щоб розвиватись.

Майстер-клас Віталія Грабара на базі кафедри нових медій факультету журналістики ЛНУ відбувся в рамках проекту «До універсального журналіста через університетську освіту» за підтримки Фонду розвитку ЗМІ Посольства США в Україні.

Записала Павліченко Т.

Описи попередніх майстер-класів за посиланнями:

Прокопишин Т. Лонгріди – новий вимір журналістики

Женченко М. Про тайм-лайни

Голоднікова Ю. Про медіакритику

Піддубний О. Конвергентна журналістика

Скорик М. Про журналістів-мультимедійників

Грабар В. Особливості роботи більд-редактора

Іваночко Я. Ідеальна новина: принципи і правила написання

Написати відгук

Ім'я (обов'язкове)

Електронна пошта (її не буде показано іншим) (обов'язкове)