28 заметок с тегом

Рабочие моменты

Позднее Ctrl + ↑

Эффект отложенных проблем.

В любых отношениях между исполнителем и заказчиком рано или поздно возникают проблемы. Тому могут послужить сорванные сроки, недопонимание технического задания, некомпетентность сотрудников с той или иной стороны. Но работая с пермскими заказчиками я могу сказать одно — первое, из-за чего начинают возникать проблемы, это понимание стоимости работ.

Пример создания сайта:
заказчик хотел сильно сэкономить, поэтому был выбран путь использования готовой CMS и шаблона, похожего на схему сайта (да, макета или прототипа не было). В итоге был куплен аккаунт на shared-хостинге, где сейчас крутится CMS, а сам сайт оставляет желать лучше как с визуальной, так и с технической точки зрения.
Вроде бы всё ничего — сайт-то работает, но!

Но заказчику пришлось переплатить немалые деньги за мелкие, но ёмкие, правки шаблона. Потому что они потребовали очень серьёзных усилий web-программиста, заняли много ресурсов, в том числе и времени.

И это ещё не всё. Сайт, сданный два месяца назад, до сих пор приходится править, потому что шаблон издаёт то одни глюки, то другие. На это тратятся деньги и время заказчика, время программиста (поверьте, сложно менять фокус внимания с одного проекта на другой). Естественно, заказчик недоволен работой шаблона да переплатой денег, но всё равно смиренно отправляет скриншоты глюков.
Ну а кто мог предсказать?

Это я и называю «эффектом отложенных проблем».

Чтобы таких сложностей не возникало — нужно сразу же, «на берегу», объяснять заказчику чем чревата экономия сейчас и какие траты он понесёт в будущем.

Ещё пример аналогичного эффекта — создание нами логотипа в прошлом месяце.
Звонок, рассказ про славную компанию, которая занимается недвижимостью. Слово за слово, заполненный бриф. В общем, всё как надо. Но только заказали один логотип. На мои доводы о том, что понадобится фирменный стиль — ноль внимания. Сейчас я понимаю, что надо было сделать красивую презентацию о том, что такое фирменный стиль и как с ним работать, но тогда... Тогда я решил, что по телефону донесу всю информацию.
Нет, не смог. В итоге сделали только логотип.
И через три недели...
И через три недели звонок и заказ на визитки, фирменные бланки, а ещё и цвета бы расписать в RGB и CMYK, да вот тут бы коммерческое предложение заверстать. В итоге всё то, что могло стоить 40 тысяч рублей обошлось заказчику дороже на несколько десятков тысяч рублей. Плюс потерянный ресурс времени, ведь агентство недвижимости ждало типографию с распечатнным рекламным макетом.

Итог

Нужно учиться правильно доносить информацию о предстоящих работах, объяснять все минусы и плюсы различных вариантов. Можно сделать приятную визуальную презентацию или подготовить какой-то текстовый скрипт, дабы заказчик мог осознать последствия своего выбора.

 
UPD: пришло письмо на почту с просьбой объяснить ситуацию проще. Объясняю:
появилось в зубе небольшое отверстие (или небольшое чёрное пятнышко кариеса). Вроде бы надо сходить к стоматологу и вылечить, но тысячи рублей как-то жалко. И вот мы тянем до тех пор, пока зуб не начнёт крошиться или боль будет настолько сильная, что иного выхода, как посетить зубного врача, у нас не будет.
В итоге приходится платить за пломбу, за обезболивающие, за работу, тратить своё время на длительные посещения стоматологии.

2017   дизайн   Рабочие моменты

Дизайн и мир вокруг.

Чем больше я углубляюсь в дизайн, тем больше я о нём ничего не знаю. Да и, как мне кажется, это вполне естественно. Почему? Хотя бы потому, что чем больше мы знаем, тем больше круг того, чего мы не знаем.

Не знал я ничего про автомобили и мне было хорошо. Потом узнал, что это не просто транспортное средство, способное переместить человека из точки А в точку Б, а высокотехнологичная система, устроенная из тысяч деталей. Например, двигатель. О! А это тоже система, с какими-то клапанами, поршнями, коленчатым валом...

Дизайн — это целая вселенная, состоящая из галактик, которые состоят из систем. И всё это подчиняется определённым правилам и законам.
Дизайн — это творчество, вписанное в рамки этих правил. Или, при хорошем знании правил, не вписанное в эти рамки.

Чтобы сделать хороший дизайн мало видеть перед собой ТЗ или качественно заполненный бриф. Нужно понимать, какие цели и задачи должен решить дизайн в конкретном случае, какая аудитория будет им пользоваться, как им будут пользоваться и многое другое.

И это весомая причина изучать дизайнеру маркетинг, психологию... и оптику, физиологию, биофизику. Да и в принципе многие науки.

Для чего?

Возьмём «истинный» чёрный цвет (HEX: #000000). Такого цвета не существует в природе. Человеческий глаз видит не сами объекты и материи, а свет, отражающийся от них. А если быть совсем занудой, то зрительное восприятие устроено таким образом, что сетчатка глаза, на которой начинается обработка световых сигналов, чувствительна к электромагнитному излучению в диапазоне длин волн 400-500 Нанометров. А чёрный цвет, если вспомнить физику, это отсутствие световых волн. Кроме того, в сетчатке глаза присутствуют три вида «колбочек», которые чувствительны к красному, зелёному и, соответственно, синему участкам солнечного спектра. Но! Ещё есть «палочки» — они создают «ночное зрение» человека, т. е. позволяют видеть в условиях низкой освещённости. Правда, с ограничением по цветам: серый, белый и тёмно-серый.

Понимая, что «истинного» чёрного цвета мы никогда не увидим в природе, дизайнер подбирает цвет шрифта для новостного сайта тёмно-серым. Контраст тёмного-серого цвета и белого фона позволить меньше напрягаться глазам, а значит пользователям сайта будет легче воспринимать большие объёмы информации.

Хороший дизайнер — любознательный дизайнер.

2017   дизайн   Рабочие моменты

Что такое — создание сайта?

Самая больная тема для тех, кто хочет получить красивый и функциональный сайт — его создание. Каким бы каламбуром это не звучало, но всё именно так. Многие из нас далеки от формирования понятных ТЗ, и  вкладывают всю информацию в «хочу, чтобы красиво». К сожалению, для создания действительного стоящего продукта это недостаточно.

Нельзя только из пшеницы сделать хлеб — нужны ингредиенты, технологические карты и определённые процессы, прежде чем хрустящая булка окажется на столе.

Если заказчик затрудняется с формированием ТЗ, а от количества непонятных слов в брифе у него волосы на руках встают дыбом, то нужно ему помочь. И прежде, чем помочь — надо понимать самим, как и из чего состоит процесс создания сайта.
Я разделил процесс создания сайта на несколько простых этапов:
 
Нулевой этап: цель
Это основа основ. Это фундамент. Всегда нужно определяться, для чего необходимо разработать сайт.
Заказчик может сколько угодного говорить «ну, у всех есть сайт, вот и мне надо» в течение недели, а затем выдать «ну, ещё каталог товаров надо, а ещё неплохо бы было электронную оплату прикрутить». И вся работа, проделанная в течение недели, окажется пустой тратой времени.
Поэтому нужно задать как можно больше точных и понятных вопросов, чтобы заказчик раскололся (или подумал) и рассказал, для чего ему нужен сайт на самом деле.
 
Первый этап: структура
Перед созданием структуры сайта настоятельно рекомендую изучить продукты заказчика, его целевую аудиторию в интернете и ближайших конкурентов (сайты, приложения).
Любой заказчик хоть немного, но представляет внешний вид своего сайта — страницы, пункты, блоки. Поэтому стоить уделить час-два времени на то, чтобы обсудить и прописать с заказчиком в любом удобном текстовом документе (MS Word/Excel, Google Таблицы, etc) структуру сайта. Каждую страницу. Зачастую уникальных страниц получается около 5-7 остальные являются однотипными, т. е. по структуре они полностью идентичны, различен лишь смысл контента (например, на автосайтах это страницы с кредитованием и страхованием).
Готовую структуру передаём на растерзание интернет-маркетологу, который пропишет основные пользовательские сценарии и расставит формы захвата (если они необходимы).
 
Второй этап: прототипирование
На данном этапе дизайнер, исходя из структуры, накидывает небольшой прототип сайта при помощи Adobe XD или Adobe Muse (либо таких сервисов, как https://gomockingbird.com/ ). Параллельно с этим определяемся со стилистикой будущего сайта.
Готовый прототип согласовывается с заказчиком.

Второй этап может занимать и день, и два, и три. Но это — лучший способ сократить время создания макета. Нет необходимости пытаться что-то придумать, нажимая пальцем в небо. Кроме того, вы экономите время заказчика и дизайнера, а значит — экономите и деньги.
 
Третий этап: UI
Когда на руках есть структура и прототип  — можно смело приступать к разработке визуальных макетов.
Процесс кропотливый и монотонный, с подбором цветов из брендбука заказчика для тех или иных форм, с отрисовкой уникальных тематических иконок, подбор web-шрифтов и многое другое, чтобы может входить в процесс создания макетов.
После получения от дизайнера готовых макетов — идём на согласование к заказчику. Если всё хорошо, то готовим UI-kit для верстальщиков.

UI-kit — это графическое изображение всех элементов интерфейса, с которыми так или иначе взаимодействует пользователь. В такой комплект, как правило, входят:
элементы навигации — табы, вкладки, кнопки prev/next, индикаторы, флажки,
элементы взаимодействия — кнопки, текстовые поля, слайдеры, чаты.
UI-kit помогает верстальщикам видеть, как те или иные элементы должны отображаться при включении/выключении или правильном/неправильном действии (например, при неправильном заполнении, поле для ввода email должно приобретать бордер красного цвета размером 2 пикселя).

 
Четвёртый этап: вёрстка
Это один из самых магических этапов для заказчика — неделю назад он видел макеты в картинках, а сейчас они ожили! Можно нажимать на кнопки, заполнять формы или просто показывать всем своим знакомым.
 
Пятый этап: логика
Логика. Бэк. Back-end. Этап, когда верстальщики передали всё в руки программистов. Здесь кнопки начинают работать по замыслу, а данные с форм приходить на почту/в CRM. Заказчик не понимает, почему этот процесс занял столь длительное время, ведь сайт (под ним понимает «вёрстку») уже был готов!
 
На этом этапы создания сайта заканчиваются и готовый продукт переезжает на хостинг заказчика.

Это не универсальный порядок работы и, более того, он не является углубленным. Кроме того, его нельзя применять на каких-то существующих проектах, где есть активные пользователи.

2017   дизайн   Рабочие моменты

Redmine

До сих пор не нашёл удобный трекер для постановки задач на работе. Пробовали и Trello (не распишешь задачи), и Битрикс24 (много неиспользуемых функций и тяжесть загрузки страниц), и много всякой всячины.
Посовещавшись с командой пришли к выводу, что пока будем жить на старом добром Redmine. Допотопный интерфейс делает загрузку страниц моментальной, а возможность прямо в нём составлять ёмкие ТЗ и указывать потраченное количество времени на работу  — отрада как для менеджера проекта, так и для дизайнеров.

Redmine был поднят из готового образа VDS у ребят из NetAngels, так что никаких танцев с Ruby плясать не пришлось.

После запуска VDS в несколько кликов настроил права и разделил задачи по проектам, кроме «Битмап» — в него вошли все мелкие работы с дизайном, которые надо завершить в свободное от основных проектов время.

Теперь хаотичные задачи из Битрикс24, Trello, Redbooth и даже Google-таблиц нашли своё пристанище в Redmine.

2017   Рабочие моменты

VDS и локали.

Пока космические корабли бороздят просторы вселенной — мы, в 21 веке, никак не избавимся от проблем с локалью на VDS.

Дано: VDS у NetAngels; на борту Debian 7 Wheezy.

Задача: решить проблемы с локалью.

~# locale
locale: Cannot set LC_CTYPE to default locale: No such file or directory
locale: Cannot set LC_MESSAGES to default locale: No such file or directory
locale: Cannot set LC_ALL to default locale: No such file or directory

Решение:
компилируем:

~# localedef ru_RU.UTF-8 -i ru_RU -fUTF-8

если выпадает ошибка:

character map file `UTF-8' not found: No such file or directory
cannot read character map directory `/usr/share/i18n/charmaps': No such file or directory

то сперва устанавливаем locales:

~# apt-get install locales

затем компилируем локали:

~# localedef ru_RU.UTF-8 -i ru_RU -f UTF-8

Если всё ок, то вывод locale -a будет таким:

~# locale -a
C
C.UTF-8
en_US.utf8
POSIX
ru_RU.utf8
2017   Рабочие моменты

Учите сотрудников.

Давно хотел написать заметку о том, что пермский бизнес не готов обучать своих сотрудников.
На то есть ряд причин вроде нехватки рабочего времени на процесс обучения или нехватки бюджета компании. Но главная, на мой взгляд, абсолютное непонимание руководства — для чего и зачем учить сотрудников? В связи с этим Пермь полна низкосортных проектов, ужасающих рекламных кампаний и визуального мусора. Последнее проявляется как на растяжках в центре городе, так и на сайтах компаний.

Давайте попробуем рассмотреть ситуацию более детально, а именно — ответим на три вопроса:

  1. Почему не стоит учить сотрудников? Лично я ответа на вопрос не нашёл, но если вы знаете, то напишите мне письмо на e-mail.
  2. Почему стоит учить сотрудников?
    а. добавляет ценности компании и её проектам/продуктам;
    b. позволяет работать с проектами, о которых раньше в компании боялись говорить;
    c. позволяет произвести реорганизацию деятельности таким образом, чтобы делать больше с меньшими усилиями;
    d. позволяет увеличить доход компании за счёт трёх предыдущих пунктов;
    e. и так далее, положительные стороны обучения можно расписывать вечно.
  3. В чём мотивация сотрудника?
    a. у сотрудников с инструментальным типом мотивации главным бонус является «больше умею — больше заработаю», иначе говоря денежное вознаграждение за выполнение более ёмких и сложных проектов;
    b. у сотрудников с профессиональным типом мотивации — возможность развиваться в нужном русле, полностью погружаться в предпочтительную область знаний;
    c. у сотрудников с патриотическим типом мотивации — стремление к развитию компании, повышение лояльности со стороны руководства, грамоты с благодарностями;
    d. у сотрудников с хозяйским типом мотивации — возможность работать над проектами самостоятельно, возможность руководить процессом;
    e. а вот у сотрудников с люмпенизированным типом мотивации, простите за каламбур, мотивации нет.

Так почему же, при таких плюсах, руководители пермских компаний не хотят учить сотрудников?
Потому что либо руководители сами некомпетентны, либо же не работают с цифрами.

Среди моих знакомых руководителей есть «старая гвардия», которая совершенно далека от информационных технологий. Для них слова «воронка продаж», «CRM» или «KPI» настолько же далеки, насколько Юпитер далеко от Земли. Таким руководителям нравится выпускать консервативный продукт: целевая аудитория вроде бы не разбегается, цели, уже не так резво, но достигаются, денежные средства на расчётный счёт поступают.
Такие компании живут и 5, и 10, и 25 лет. У них прочный фундамент. Они не приносят ничего нового, но и не стремятся изменить историю. Они просто существуют. До определенного момента.

Антициферники. Руководители, которых я называю «антициферники», как правило плывут по течению со своей услугой или продуктом. Они могли бы сменить старую лодку на каравеллу, но для этого надо посчитать цифры.
Но зачем, ведь вроде и так не плохо? С такими мыслями и плывут. Самый жирный минус этого варианта — водопад, который ждёт впереди. А он ждёт.
Таким компаниям, как я думаю, свойственно либо меняться и превращаться в огромные пассажирские лайнеры, капитаны которых, не выпускаю трубку изо рта, улыбаются и одновременно подмигивают. Либо гордо идти ко дну с грустными лицами.

Что делать? Я думаю, что надо меняться. Надо постоянно овладевать новыми знаниями и постигать новые горизонты. Надо пробовать и внедрять те или иные методологии работы, анализировать и смотреть на результаты. Надо учиться самим и учить свой коллектив. Понемногу, маленькими шагами, идти вперёд.

И под конец моё любимое — несколько крутых принципов «Дао Тойота» в кратком содержании:

Принцип 1. Принимай управленческие решения с учетом долгосрочной перспективы, даже если это наносит ущерб краткосрочным финансовым целям.
Принцип 10. Воспитывай незаурядных людей и формируй команды, исповедующие философию компании.
Принцип 12. Чтобы разобраться в ситуации, надо увидеть все своими глазами
Принцип 14. Станьте обучающейся структурой за счет неустанного самоанализа и непрерывного совершенствования.

P.S. Не могу вспомнить точно где, но я слышал такую фразу:

— Вы не боитесь, что научите сотрудника всему, а он уволится?
— Я боюсь, что не научу, а он останется.

2017   Рабочие моменты

Удобный просмотр CSS в Chrome.

Открыл для себя расширение для Chrome, которое облегчает просмотр CSS.
Называется CSSPepper. Показывает он много всяких полезностей:

  1. используемые гарнитуры и шрифты, их кегль и прочие тонкости типографики;
  2. цвета на сайте и их HEXы;
  3. все изображения страницы (при нажатии на изображения их можно скачать);
  4. мета-теги;
  5. и прочие полезности.

Пример того, как CSSPeeper видит страницу новостей Яндекса:

Удобный просмотр CSS в Chrome

Поставить дополнение можно напрямую из интернет-магазина Chrome или
с сайта разработчика https://csspeeper.com/

2017   web   дизайн   Рабочие моменты

Несерьёзный подход

XXI век.
Интернет есть у каждого в кармане.
Бизнес, конечно же, в этот самый интернет постарался залезть по уши. Без знаний, без умений. Просто залезть. Местами выглядит красиво — навороченные лендинги, продающие тексты, отточенные CRM, позволяющие охотиться за посетителем даже в свинцовом бункере. Но когда дело доходит до пункта «Контакты», а именно указанных телефонов и адресов электронных почтовых ящиков, по телу пробегают слоны нервной дрожи!

Итак, небольшое пособие по написанию номеров телефона в разделе контакты или в подписи отправляемых писем:

как не надо писать:
+7 912 999 99 99
7-912-9999999
8-(912)-999-99-99
+7 (912) 999 99 99

а как надо:
8 (912) 345-67-89 (это пример номера мобильного телефона)
+7 342 345-67-89 (а это пример стационарного номера в международном формате)

С почтой ситуация немного иная: успешный бизнесмен, рассказывающей о том, как успешно жить в успехе, предлагает связаться с ним по адресу uspeh@mail.ru. Или uspeh@yandex.ru. Серьёзно?
То есть эксперт, предлагающий свои курсы по цене сто тыщ мильёнов, сам не потратил и пяти минут времени на привязку почты к своему домену uspeh.ru? Или ему жалко отдать тысячу рублей за настройку почты? Или помощники бизнесмена лоханулись?

О мужчинах судят по часам и обуви.
Об успешных инфо-бизнесменах — по написанию данных в разделе «Контакты», подписи в письме и доменной почты.

P.S.
Кому интересно «Как привязать почту к домену бесплатно?» — https://yandex.ru/support/pdd/about.xml
За бесплатной консультацией «Что такое CNAME/MX? Куда это вписывать?» можно обратиться ко мне — ilya@blinperm.ru.

2017   дизайн   Рабочие моменты