В прошлом году я делал обзор книг, на которых реально растут люди и реально улучшаются процессы.



Тогда понадобился год, чтобы прочитать в десять раз больше бумаги и сделать выборку, которая оказалась неожиданно полезной многим. Вот результаты ещё одного года — ещё N+2 книги для бизнеса, которые реально помогают.

Центральный объект привлекает внимание, дальше вы вчитываетесь в детали. Выглядит хорошо, но дизайнер очень тщательно спрятал смысл.

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

Андрей Скворцов рассказал, как именно выглядит рынок (почему красивая картинка лучше продаётся) и что нужно для реально понимающих заказчиков. Сам Андрей уже долгие годы занимается инфографикой, но при этом никогда не был дизайнером и не умеет рисовать. Зато он знает, что такое «работающий материал», и именно это помогает ему продавать свой продукт. На мастер-классе в Digital October он дал несколько полезных советов.

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

Итак, сегодня я хочу поговорить о книге профессора Гэвина Кеннеди «Договориться можно обо всём» и о том, как навык ведения переговоров помогает в профессиональной деятельности и повседневных активностях. Саму книгу я прочитал довольно давно, но только сейчас накопилось достаточное количество ярких примеров того, что указанные в ней практические советы эффективны и действуют почти безотказно.

Привет, Хабр.
Сразу хочу отметить, что если мы говорим об иконках, их можно масштабировать двумя способами (других я просто не знаю): конвертировать иконки в шрифт и подключать их через @font-face, либо использовать SVG в качестве формата для этих иконок.

Немного отойду от темы и расскажу предысторию.

Предыстория

Я было решил использовать у себя на сайте шрифтовые иконки, казалось бы все хорошо: и размер менять можно, и цвет задавать и запрос к серверу всего один (на подключение шрифта). Другими словами, подключаемый шрифт это и есть своеобразный «CSS спрайт», верно?

Я давай проверять, везде ли все красиво выглядит. Оказалось, что не все так хорошо как хотелось бы, потому как в некоторых размерах иконки выглядели кособокими, а при отключенном сглаживании вообще противно смотреть на них стало. Что делать? Использовать второй вариант — SVG, о чем и пойдет речь.

Все знакомы с css параметром border, но есть ли вещи, которые мы не знаем о нем?

Сегодня решил поделиться с вами своими материалами по автоматизации работы в photoshop. А именно это тот стартовый шаблон с которого я начинаю делать любой дизайн сайта.
Подправил, добавил, оформил в виде приятного продукта под названием — StartPSD.
Можно скачивать, редактировать, пользоваться на здоровье!

Встречайте.

Начинаю делать серию видеоуроков по созданию интернет-магазина на MODX Revolution + Shopkeeper. Пока видео без голосового сопровождения, но думаю и так будет всё понятно.
Из первой части вы узнаете как:

• Установить и настроить MODX Revolution;
• Создать шаблоны сайта;
• Создать меню;
• Создать и настроить контекст для каталога товаров;
• Установить Shopkeeper.

Хочу поделиться с вами моим способом создания затухающих полосок без использования изображений. Дальше под катом описан метод создания таких элементов с комментариями и примером.

Теория создания самодельной автомобильной спутниковой сигнализации с web-интерфейсом и поддержкой eCall / ЭРА-ГЛОНАСС на базе микроконтроллеров STM32 как основа концепции «Умный автомобиль», и её использование в системах «Умный дом». Реализация аналога технологии Volvo On Call и автомобильной социальной сети Toyota Friends.

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

Пролог

Почти полгода назад, 3 сентября 2011 года мы начали разработку кредитного сервиса Conpay.ru. Задача, поставленная перед командой, была определена очень просто: дать возможность покупателям интернет-магазинов приобретать товары в кредит. Но, не смотря на простоту в определении этой задачи, для ее решения нам пришлось на полгода выпасть из нормальной жизни и с головой уйти в мутную воду финансовых стартапов. На старте проекта команда состояла всего из 3 человек: полтора программиста и полтора менеджера. Тем не менее, даже поняв сложность задачи и ограниченность собственных ресурсов, мы продолжали работу на энтузиазме и вдохновении (и бодреньких книжках типа Фрайда и Кавасаки). И вот, наконец, после нескольких месяцев трудов и испытаний нам удалось запустить сервис.

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

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

Очень часто мне встречаются сайты которые отвратительно выглядят на iPhone4, и дело даже не в том, что большинство из них не адаптированы под маленький экран, а в том, что разработчики не учитывают новый тип экранов. На иконки не хочется смотреть, на кнопки не хочется нажимать, а от картинок вообще хочется… закрыть сайт. То, что призвано завлечь пользователя на сайт, вникнуть в его суть, а не покинуть его тут же — теперь работает совершенно наоборот. Но пользователи iPhone в целом привыкли к такой ситуации, т.к. телефон не может заменить полноценного браузинга.

Однако, совсем недавно Apple дала нам iPad 3 небольшую фору, для того, чтобы привести дела впорядок. iPad'ом уже пользуются вполне себе полноценно, поэтому сайты должны выглядеть на нем ничуть не хуже, чем на ноутбуке или стационарном компьютере. И я считаю, что iPad 3 — это лишь первый шаг к полноценному внедрению Retina экранов в те же ноутбуки, а за ними и в стационарные мониторы. Apple уже готовит свою OS для Retina, у Windows 8 скорее всего с этим тоже проблем не будет, с их новым подходом в дизайне интерфейсов.

Знаете ли вы, что письмо потенциальному клиенту с коммерческим предложением лучше всего отправлять с полудня и до трёх часов дня, лучший день для приглашения на вечеринку — пятница, а рекламные рассылки интернет-магазинов лучше всего делать с 19 и до 22 часов?

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

Начнём с того, как выбрать день для отправки вашего письма.



Под катом — расшифровка данных и материал о выборе времени для отправки в течение дня.

Привет, Хабраюзер!
Я даже не знаю что хуже, что код для этого секундомера занимает ~ 1100 строк, или то что он работает только в половине браузеров.
Но если же тебе интересно как это работает, прошу под кат.

Привожу перевод статьи Ника Карсона. В статье собраны вместе, как мне кажется, основные правила построения интерфейса для iOS приложений.

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

2. Ориентируйтесь на устройство при создании приложений: учтите не только размер экрана, но и где и когда устройство используется. Больше всего iPad используется для развлечений между 8-11 часами вечера, перед сном, тогда как iPhone — в очереди на автобус или в кофейне. Учтите различные сценарии использования при разработке приложений – включая и то, как далеко устройство расположено от лица пользователя.

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

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

5. При адаптации приложения к экранам различных размеров, помните, что при значительном его изменении – например, от iPhone к iPad – способ использования устройства также изменится. Если размеры ограничены, используйте основные функции приложения, при их увеличении – можно включить любые дополнительные функции, которые не вошли в более сжатую версию, так как у вас появляется возможность обыграть дополнительное пространство.

За остальными 45-ю — добро пожаловать подкат.

UPD: Продолжение статьи с примером техзадания

Не так давно на хабре были две статьи (Согласно техническому заданию и А зачем мне ТЗ? Я и так знаю!) посвященные техническим заданиям. У меня обе статьи вызвали, мягко говоря, недоумение, в особенности статья «Согласно техническому заданию». На мой взгляд, это вообще вредная статья, которая приводит к неверному понимаю сути ТЗ. В связи с этим хочу выразить свой взгляд на этот вопрос. Не буду говорить обо всех тех. заданиях, слишком широка тема, но думаю смогу рассказать о ТЗ на сайт.

То описание технического задания, о котором речь пойдет ниже, не является пересказом ГОСТа, но скорее является его творческой переработкой, хорошо сдобренной горьким опытом. Описанный ниже подход к ТЗ не охватывает все аспекты сайтостроения, но задает общее направление.

Большинство сайтов можно отнести к маленьким и очень маленьким проектам, масштаба единиц человеко-месяцев. В силу малости размеров такие проекты спокойно поддаются хорошему продумыванию и легко реализуются с помощью водопадной модели, достаточно просто не лениться на каждом этапе разработки (от написания ТЗ до сдачи проекта). Применять к этим проектам гибкие методологии разработки нет смысла, а как раз есть смысл применять хорошее ТЗ. К тем сайтам, которые не попадают под водопадную модель не стоит применять описанный ниже подход.

1. Обоснование необходимости ТЗ

А зачем вообще нужно ТЗ на сайт? Заказчик говорит: «Нужен следующий сайт: каталог товаров, корзина, форма заказа, доставка, мы на карте, о нас, обратная связь». Что не ясно? Ничего необычного, всё обыденно и рутинно.

Разработчик отчетливо представляет, что нужно сделать, а сделать, в его понимании нужно вот так:

Есть некоторый опыт проектирования, и реализации интернет магазинов который мы решили обобщить. Мы были удивлены выводами о степени важности разделов в интернет магазине, но приняли их к сведению. В каждом новом проекте мы идем по этому списку и в этом порядке. Объясняем заказчику, почему нужно начинать с описания «аудитории», а не с «главной страницы» сайта.

Здравствуй, дорогой хабрадруг! Сегодня существуют более тысячи способов создать кнопку; чтобы понять их сущность, вам нужно лишь потратить немного времени, просмотрев работы на сайте dribbble.com. Большинство из этих примеров очень похожи друг на друга, однако время от времени попадаются и такие кнопки, на создание которых потратили чуть больше внимания, времени и сил.



Воспользовавшись замечательными параметрами CSS3, мы можем создать элегантые и стильные кнопки без особых усилий (учитывая старые браузеры, конечно). Создаете ли вы кнопку непосредственно в CSS или пользуетесь специальными инструментами для их создания, всегда нужно тщательно подумать о том, как ваша кнопка будет выглядеть в контексте веб-сайта.

Я руковожу собственной компанией, занимающейся коммерческой веб разработкой, уже более 8 лет. За эти годы мы значительно выросли и количественно и качественно. У нас достаточно клиентов и работы всегда хватает. Но с каждым днем я все больше убеждаюсь, что если рассматривать веб-разработку с точки зрения бизнеса, то «игра не стоит свеч».

Фриланс, как массовое явление, появился совсем недавно, думаю не больше 10 лет назад, вместе с глобальным распространением и социализацией интернета, и на сегодняшний день эта модель деловой активности еще очень мало изучена, сегодняшние фрилансеры по сути — первопроходцы, изучающие новый способ жизни прямо на себе.

Я отправился в свое одиночное плавание в океане мировой экономики около 5 лет назад, но безопасный промысел в прибрежной зоне быстро наскучил, меня всегда манил открытый океан, где вдали проплывали огромные лайнеры мировых корпораций и быстрые яхты стартапов.

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

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

1. Отображайте нажатия кнопок и кнопкоподобных ссылок

Мой излюбленный совет. Когда стиль кнопки задаётся в CSS, или когда для отображения необычной кнопки используется рисунок (либо как фон, либо как элемент <img />), то кнопка не реагирует на нажатие во всех или в некоторых браузерах (зависит от ситуации). Вот какой простой уловкою вы можете дать знать посетителю сайта, что он и впрямь нажал на нечто нажимаемое:

.mybutton:active {
   position: relative;
   top: 1px;
   left: 1px;
}

Этим кодом кнопка смещается на 1 пиксел направо и на 1 пиксел вниз, когда её нажимают. Испробуйте: выглядит весьма убедительно.

Есть другие, не менее быстрые варианты: придать границе свойство inset, указать свойству text-indent значение 1px, изменить направление градиентного фона (что можно сделать быстро, если для этого не придётся прибегнуть ко графическому редактору, то есть если где-то ещё на сайте используется готовый перевёрнутый градиент), или комбинация нескольких из них.

2. Плавные переходы (CSS3 transitions)