Pull to refresh
9
0

User

Send message

16 инструментов для создания прототипов

Reading time5 min
Views490K


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

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

16 инструментов со ссылками и их краткое описание
Total votes 53: ↑47 and ↓6+41
Comments33

ISO 9241-210. Планирование и внедрение Human-Centered Design

Reading time8 min
Views18K


Из опроса в конце предыдущей статьи я узнал, что читателям интересны все три из предложенных аспектов Human-Centered Design (далее — HCD):
  • Стандарты,
  • Методология,
  • Внедрение.

В этой статье я расскажу, как использовать стандарт ISO 9241-210 для планирования и внедрения HCD-подхода. Также я покажу как HCD может дополнить две наиболее часто используемые модели разработки: Scrum и Waterfall.
Поехали
Total votes 9: ↑8 and ↓1+7
Comments13

50+ лучших дополнений к Bootstrap

Reading time5 min
Views202K


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

Для статьи я подобрал наиболее полезные дополнения «на все случаи жизни».
Читать дальше →
Total votes 123: ↑111 and ↓12+99
Comments25

Книги по дизайну

Reading time16 min
Views28K
Доброго времени! В этот раз мы здесь опубликуем свои недавно вышедшие книги для творческих людей.

image

1. Скетчи. 50 креативных заданий для дизайнеров. Автор: Уитни Шерман
2. Сожги свое портфолио! То, чему не учат в дизайнерских школах. Автор: Майкл Джанда
3. Я-бренд. Формула успеха. Автор: Марк Эко
Читать дальше →
Total votes 15: ↑14 and ↓1+13
Comments0

Верстка email рассылок от А до Я для чайников

Reading time9 min
Views403K
Уже 3 с лишним года занимаюсь дизайном и версткой почтовых рассылок, которые ориентированы на англоязычных пользователей. За время работы перелопатили огромную кучу информации, перепробовали много вариантов верстки, набили достаточное количество шишек. Были найдены и исправлены типичные баги, которые в той или иной мере повторялись во всех почтовых клиентах. Также нашлись проблемы с некоторыми CSS свойствами — различные почтовые клиенты интерпретировали их по разному. Каждое письмо тестировалось на самых популярных почтовых клиентах: Gmail, Outlook, Yahoo, Android, iOS, MozillaThunderbird, Microsoft Outlook, The Bat. Рассылки ходят на сотни миллионов пользователей и приносят очень хорошие результаты. Итак, приступим к изучению.
Читать дальше →
Total votes 66: ↑62 and ↓4+58
Comments35

86 бесплатных площадок для продвижения стартапов на международном рынке

Reading time4 min
Views102K


Мы дополнили и адаптировали оригинальную подборку, выбрав исключительно бесплатные ресурсы для продвижения стартапов на международном рынке. Помимо этого мы переработали первоначальную классификацию, ввели ранжирование по потенциальному охвату аудитории (для площадок с обозначенным охватом) и распределили соответствующие ресурсы в тематические категории.
Читать дальше →
Total votes 33: ↑32 and ↓1+31
Comments9

300 потрясающих бесплатных сервисов

Reading time11 min
Views1.6M


Автор оригинальной статьи Ali Mese добавил ещё 100 новых бесплатных сервисов. Все 400 потрясающих сервисов доступны здесь. И еще подборку +500 инструментов от 10 марта 2017 г. смотрите здесь.



A. Бесплатные Веб-Сайты + Логотипы + Хостинг + Выставление Счета

  • HTML5 UP: Адаптивные шаблоны HTML5 и CSS3.
  • Bootswatch: Бесплатные темы для Bootstrap.
  • Templated: Коллекция 845 бесплатных шаблонов CSS и HTML5.
  • Wordpress.org | Wordpress.com: Бесплатное создание веб-сайта.
  • Strikingly.com Domain: Конструктор веб-сайтов.
  • Logaster: Онлайн генератор логотипов и элементов фирменного стиля (new).
  • Withoomph: Мгновенное создание логотипов (англ.).
  • Hipster Logo Generator: Генератор хипстерских логотипов.
  • Squarespace Free Logo: Можно скачать бесплатную версию в маленьком разрешении.
  • Invoice to me: Бесплатный генератор счета.
  • Free Invoice Generator: Альтернативный бесплатный генератор счета.
  • Slimvoice: Невероятно простой счет.

Читать дальше →
Total votes 341: ↑325 and ↓16+309
Comments107

Буфер вывода в PHP

Reading time8 min
Views51K
В этой статье я хочу рассказать о том, как реализован слой «буферизации вывода» в PHP, как работает и как с ним взаимодействовать из PHP. В этом слое нет ничего сложного, но многие разработчики либо совсем не понимают, как с ним обращаться, либо не имеют полной ясности. Всё, о чём я буду писать, относится к PHP версии 5.4 и выше. Именно начиная с неё изменились многие вещи, связанные с буфером вывода (БВ). По сути, этот функционал был полностью переписан, поэтому совместимость с версией 5.3 сохранилась лишь частично.

Что такое буфер вывода?


Поток вывода в PHP содержит байты, обычно в виде текста, которые разработчику надо вывести на экран. Чаще всего для этого используется конструкция echo или printf(). Во-первых, нужно понимать, что любая функция, которая что-то выводит, будет использовать БВ из области PHP. Если говорить о расширениях для PHP, то можно получить доступ к функциям, пишущим в SAPI напрямую, в обход любого вышерасположенного БВ. API C задокументировано в lxr.php.net/xref/PHP_5_5/main/php_output.h, отсюда можно почерпнуть немало информации, например, о размере буфера по умолчанию.

Второй важный момент: слой БВ является не единственным слоем, в котором буферизуются выводимые данные.

И третье: в зависимости от SAPI, который вы используете (веб или cli), слой БВ может вести себя по-разному.

Ниже представлена схема, которая поможет понять всё вышесказанное:

Читать дальше →
Total votes 59: ↑52 and ↓7+45
Comments10

Лекции Технопарка. 1 семестр. Web-технологии

Reading time4 min
Views172K
Сегодня этим постом мы открываем цикл еженедельных публикаций учебных материалов Технопарка. Если кто-то ещё не знает, Технопарк — это совместный образовательный проект Mail.Ru Group и МГТУ им. Н. Э. Баумана. На данный момент здесь проходит обучение по 20 IT-дисциплинам 91 наиболее талантливый студент. Технопарк существует с 18 ноября 2011 года, а первые счастливчики приступили к занятиям в декабре 2011 года.

Обучение в Технопарке совершенно бесплатное, оно проходит после занятий в университете. Стать участниками проекта могут студенты 3-5 курсов. Хотя для 2 и 6 курсов можем сделать исключение. Обучение длится 2 года, оно разбито на 4 семестра, в каждом из которых проходят по 3-4 предмета. Первый блок первого семестра посвящён всему, что связано с web-технологиями, от истории возникновения до программирования и безопасности web-приложений.

Лекция 1. Введение


На вводном занятии вы познакомитесь с краткой историей развития интернета, основными трендами в развитии web-приложений, облачных сервисов и мобильных приложений. Также на лекции разобрано устройство и работа несложного web-приложения, обсуждены такие фундаментальные понятия, как система адресации в интернете, домены, HTML-страницы и протокол HTTP. Напоследок кратко рассказано о CGI-скриптах, их назначении и особенностях работы.


Читать дальше →
Total votes 55: ↑51 and ↓4+47
Comments11

Чек-лист ИТ-стартапа на начальной стадии развития: что нужно сделать, прежде чем тестировать каналы продаж

Reading time11 min
Views40K
В Акселераторе ФРИИ работу со стартапами начинают с того, что пытаются определить, на какой стадии развития находится компания. Почему именно с этого? В целом, большая часть проблем у стартапов появляются от отсутствия фокуса: предприниматели совершают много ненужных действий, не концентрируясь на том, что приведет их бизнес к точке безубыточности. Чтобы понять, какие действия компании необходимо совершить в настоящий момент, нужно определить, на каком этапе развития она находится. Для этого во ФРИИ используется такой инструмент, как дорожная карта или road map. Мы выделяем в развитии ИТ-стартапов три больших этапа – поиск и изучение клиентов, тестирование каналов продаж и масштабирование. В данном материале мы пошагово рассмотрим первую большую стадию развития стартапа – Customer Discovery, поиск и изучение клиентов. Обычно оборот компаний на этой стадии не превышает 100 тысяч рублей. Какие шаги должен совершить ИТ-стартап, чтобы уверенно перейти к следующей стадии — тестированию каналов продаж?
Читать дальше →
Total votes 22: ↑20 and ↓2+18
Comments0

01 Ссылки для UX-специалистов

Reading time3 min
Views93K
В этой подборке я хочу поделиться информационными ресурсами, где можно почерпать новые знания, отследить новые методы, техники и аналитку, а также улучшить свои навыки в области UX. Полезно будет не только специалистам из области юзабилити, а также всем кто имеет отношение к разработке веб-продуктов.


Читать дальше →
Total votes 60: ↑57 and ↓3+54
Comments13

58 признаков хорошего интерфейса

Reading time16 min
Views380K
У хорошего интерфейса пользователя высокая конверсия и его просто использовать. То есть, он хорош и для бизнеса, и для использующих его людей. Вот список опробованных нами идей.

1 Один столбец вместо нескольких


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

image
Читать дальше →
Total votes 226: ↑182 and ↓44+138
Comments102

Закон Фиттса или как его использовать

Reading time3 min
Views30K
Здравствуйте, хабровчане!

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

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

Формула:
T = a + b * log ( D / W + 1 ),

где T — время работы пользователя с меню в (мс), a и b — коэффициенты навыков и умений работы пользователя с тем или иным устройством, D — расстояние от одного до другого пункта меню, W — ширина пункта меню при движении к нему от другого пункта меню.

Для большего понимания представим расчетную схему:


Рисунок — Расчетная схема закона Фиттса.

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

Рассчитаем среднее время для паркетного меню с параметрами: p1=120 px, p2=160 px, d=10 px, n=6, где n – количество пунктов меню.
Получим таблицу, в которой указаны параметры Wi, Di, Ti.
Читать дальше →
Total votes 28: ↑22 and ↓6+16
Comments14

Webrtc, Peer Connection — создание полноценного видео чата в браузере

Reading time5 min
Views67K

Введение


Webrtc на хабре уже неоднократно упоминался, хотелось бы рассказать немного про техническую часть реализации и осветить создание небольшого видео чата. Хочу сразу оговорится, что реализация webrtc постоянно меняется, в том числе названия функций api, их параметры.
Всем, кому просто хотелось бы посмотреть сразу как это все работает, сюда: apprtc.appspot.com демка от гугла все что нужно — это перейти по ссылке и послать её еще кому-нибудь уже с номером комнаты. В конце нужно поменять цифры если окажется что комната переполнена. Кому интересно как это все работает добро пожаловать под кат
Читать дальше →
Total votes 47: ↑43 and ↓4+39
Comments33

WebRTC #1 — Знакомимся

Reading time3 min
Views153K


Многие уже слышали о проекте WebRTC, некоторые даже используют его (или пытаются применять в существующих проектах), а кто-то злобно потирает руки, предвкушая постепенную расправу со Skype и Flash.

Погуглив в Хабре (хе-хе) я почему-то не нашел статей, которые углублялись в техническую сторону WebRTC, показывали бы примеры его использования.

Что же, я попытаюсь порадовать вас схемками, кодом. В общем, именно тем, что всем по вкусу. Так пройдем же под кат, мой любимый читатель.
Читать дальше →
Total votes 58: ↑56 and ↓2+54
Comments12

Делаем свой персональный Skype, пошаговая инструкция создания WebRTC приложения

Reading time4 min
Views138K
WebRTC

WebRTC позволяет реализовать real-time аудио/видео связь через браузер (firefox и chrome).

В этом топике я расскажу как реализовать простейшее WebRTC приложение.
Читать дальше →
Total votes 102: ↑98 and ↓4+94
Comments28

Пуленепробиваемый Node.js

Reading time2 min
Views27K
Проблемы индейцев
Одним из остававшихся до недавнего времени недостатком Node.js, который отпугивал бекенд-разработчиков от использования Node.js, был тот факт, что непойманное исключение в потоке рушило воркера, и все клиенты, которые ждали от него ответа, не получали ничего.

tl;dr Eсть новое API для асинхронного try\catch. Из статьи можно скопипастить пример и поиграться.
Читать дальше →
Total votes 56: ↑47 and ↓9+38
Comments21

«Дыры» стартапов: самые распространенные проблемы молодых компаний, которые мешают их развитию

Reading time7 min
Views56K
Каждый месяц Фонд развития интернет-инициатив проводит мероприятия для предпринимателей под названием «Бизнес-секреты». На этих встречах лидеры стартап-индустрии делятся со слушателями секретами увеличения прибыли проекта и дают советы по его продвижению. Такие мероприятия для их участников не только полезны, но и бесплатны – достаточно только зарегистрироваться и прийти на встречу в наш мультимедийный конференц-зал Сити Холл в БЦ Silver City.

В октябре на одном из таких мероприятий Артем Азевич, руководитель трекинга ФРИИ, рассказал о «дырах» стартапов или «узких местах», которые необходимо заделывать, чтобы в разы улучшить их бизнес-показатели. Данный материал на основе выступления, дополненный кейсами проектов, рассказывает об этапах развития IT-стартапа на ранней стадии и о самых распространенных проблемах предпринимателей, которые не дают им начать зарабатывать. Почему это происходит?
Читать дальше →
Total votes 45: ↑32 and ↓13+19
Comments39

Адора Чьюнг (часть 1): продукт и кривая честности

Reading time15 min
Views20K


Cтэнфордский курс CS183B: How to start a startup. Стартовал в 2012 году под руководством Питера Тиля. Осенью 2014 года прошла новая серия лекций ведущих предпринимателей и экспертов Y Combinator:


Первая часть курса
Читать дальше →
Total votes 14: ↑11 and ↓3+8
Comments8

9 основных принципов отзывчивого веб-дизайна

Reading time4 min
Views129K

Отзывчивый дизайн — отличное решение проблемы корректного отображения сайта на разных экранах. Однако новичкам зачастую трудно понять основы, обучаясь только по книгам/статьям. С каждым днём появляется всё больше различных устройств, имеющих разные размеры экрана, поэтому создание дизайна в пикселях и только для настольных компьютеров/смартфонов остаётся в прошлом. Именно поэтому сейчас стоит изучить принципы отзывчивого дизайна — дизайна, совмещающего в себе адаптивность и резиновость (если вы ещё не знакомы с адаптивным дизайном, то эта статья будет хорошим выбором для начала изучения).
Читать дальше →
Total votes 69: ↑62 and ↓7+55
Comments17

Information

Rating
Does not participate
Registered
Activity