В копилке Plarium Krasnodar набралось много интересных материалов, и мы хотим поделиться примечательными, на наш взгляд, примерами нарративного дизайна, связанного с проектированием пользовательского взаимодействия (UX) и графического интерфейса (GUI).
Рубрика «разработка интерфейсов»
Как интерфейс рассказывает истории в видеоиграх
2020-03-24 в 8:03, admin, рубрики: GUI, usability, UX, ux design, ux дизайн, Блог компании Plarium, графический дизайн, графический интерфейс, графический интерфейс пользователя, дизайн, Дизайн игр, дизайн интерфейсов, игровая индустрия, игры, Игры и игровые приставки, интерфейсный дайджест, интерфейсы, нарратив, нарратив в игре, нарративный дизайн, разработка игр, разработка интерфейсов
ок.tech: Frontend Meetup #2: мини-интервью спикеров
2019-11-20 в 9:28, admin, рубрики: ReactJS, Блог компании Одноклассники, интерфейсы, одноклассники, ок.tech, Разработка веб-сайтов, разработка интерфейсов
Фронтенд — одно из самых быстроразвивающихся направлений разработки, вспомните разработку интерфейсов 3-х годичной давности и сравните её с тем, что происходит сейчас и сразу станет понятно — изменилось очень многое, если не совершенно все. С молниеносной скоростью устаревают подходы, считавшиеся передовыми, новый библиотеки становятся популярными буквально в считанные дни.
В преддверии второго митапа Одноклассников по фронтенду, который пройдет 26 ноября в нашем петербургском офисе, мы поговорили со спикерами об их пути в разработку интерфейсов, о том что они считают главными событиями индустрии за 2019 год и десятилетие, попытались понять какие проблемы стоят перед сообществом сейчас, а так же спросили как будет развиваться разработка интерфейсов в будущем.
Под катом ответы на многие интересующие вас вопросы.
ок.tech: Frontend Meetup #2
2019-11-08 в 8:32, admin, рубрики: meetup, ReactJS, Блог компании Одноклассники, интерфейсы, ок.tech, Разработка веб-сайтов, разработка интерфейсов
26 ноября в петербургском офисе Одноклассников пройдёт ок.tech: Frontend Meetup #2.
Вместе с коллегами из Одноклассников, ВКонтакте и Hazelcast поговорим про новый фронтенд OK.RU, сделанный на связке React + Graal, обсудим может ли “Lifting State Up” – один из двенадцати ключевых концепций в официальной документации React, приводить к плохой производительности, а также узнаем несколько историй про баги и технические решения, которые были предприняты, чтобы с ними справиться.
→ Зарегистрироваться на ок.tech Frontend Meetup #2
Под катом тезисы выступлений и расписание.
Читать полностью »
Алгоритмические задачи во фронтенде. Примеры и конкурс Яндекса
2018-10-16 в 12:17, admin, рубрики: css, javascript, Алгоритмы, Блог компании Яндекс, интерфейсы, Промышленное программирование, разработка интерфейсов, Спортивное программированиеВчера стартовал новый Яндекс.Блиц — на этот раз конкурс будет интересен разработчикам интерфейсов. Обладателям мест с первого по пятое мы предложим устроиться к нам по упрощённой схеме: одна секция собеседования вместо четырёх. Тем самым Блиц остаётся наиболее быстрым способом попасть в Яндекс.
Задачи конкурса вновь приближены к боевым продакшен-задачам — от вас потребуются не только навыки фронтендера, но и знания алгоритмов. Зарегистрируйтесь здесь, чтобы успеть принять участие в квалификационном раунде.
Блиц — хороший повод поговорить об истории алгоритмических задач, возникающих в промышленном фронтенде, и о том, как они отличаются от конкурсных.
Читать полностью »
Яндекс вновь открывает набор в Школу разработки интерфейсов. Примеры лекций и домашних заданий с предыдущего набора
2018-08-03 в 6:00, admin, рубрики: usability, Блог компании Яндекс, интерфейсы, лекции, Разработка веб-сайтов, разработка интерфейсов, Учебный процесс в IT, шри, яндексПриглашаем студентов вузов и начинающих специалистов в Школу разработки интерфейсов Яндекса. Обучение бесплатное, и в этот раз будет открыто сразу в трёх городах: Москве, Санкт-Петербурге и Симферополе. Приём заявок закрывается уже в августе.
Кто такой разработчик интерфейсов? Это тот, кто разрабатывает на HTML, CSS, JavaScript и отвечает за реализацию взаимодействия с пользователем. В нашей Школе мы делаем акцент на практике, потому что верим, что качественного результата можно добиться только через опыт, а теория сейчас легко доступна для всех. К примеру, сегодня мы поделимся с читателями Хабра всеми записями наших лекций с предыдущего набора Школы.
16 инструментов React, которые пригодятся разработчикам интерфейсов
2018-07-03 в 8:28, admin, рубрики: github, React, Блог компании Skillbox, инструменты, интерфейсы, Разработка веб-сайтов, разработка интерфейсов
Для создания пользовательских интерфейсов существует большое количество инструментов (ваш К.О., не благодарите). Один из наиболее эффективных — React. Наверное, на Хабре нет нужды рассказывать о том, что это такое и зачем.
Сегодня мы решили опубликовать подборку классных вспомогательных элементов для разработчиков, которые используют React. Вероятно, подборка не исчерпывающая, но зато позволит дополнить инструментарий. Если вы используете еще что-то, чего нет в подборке, делитесь в комментариях, а мы скажем дружно спасибо и добавим классные предложения в подборку. Предупреждение — под катом довольно много гифок, у кого платный трафик — осторожнее, ребята.
Читать полностью »
Как мы нанимаем с помощью буткемпа. Опыт отдела поисковых интерфейсов
2018-05-22 в 13:00, admin, рубрики: Блог компании Яндекс, найм, разработка интерфейсов, управление персоналом, яндексНанимать сложно. Нанимать на потоке много человек в месяц ещё сложнее.
Для компании найм сложен тем, что приходится конкурировать с другими компаниями, которые предоставляют схожие, а иногда и лучшие условия. Нужно уметь чем-то выделяться, предоставлять возможности, которых нет у других.
Для человека смена работы это, как правило, дополнительная психологическая нагрузка: новые задачи, новые коллеги, новый маршрут поездок на работу. А при найме в Яндекс добавляется ещё и нелёгкий выбор команды, в которой предстоит работать. У нас всегда есть предложения от нескольких команд, и соискателю нужно за короткое время собеседований и получения предложения о работе выбрать, в какую команду идти.
Как обучают в Школе разработки интерфейсов Яндекса, и чему там научился я
2017-01-17 в 13:50, admin, рубрики: css, javascript, node.js, Блог компании Яндекс, БЭМ, Разработка веб-сайтов, разработка интерфейсов, фронтенд, шри, яндексМеня зовут Павел Гринченко. Я был одним из участников Школы разработки интерфейсов Яндекса в Симферополе. Когда-то давно я посмотрел видеозаписи самой первой Школы 2012 года и почерпнул из них очень много полезной информации. Затем я узнал, что в моём городе пройдёт новая Школа, и решил обязательно поучаствовать.
Чтобы попасть в Школу, требовалось заполнить анкету и сделать два тестовых задания. Одно из них — по вёрстке, довольно простое. Звучало оно так: сверстать список ачивок, но максимально гибко и реюзабельно (например, используя СSS counters). Второе задание оказалось посложнее: написать обфускатор CSS-классов без использования сторонних библиотек. На входе — массив классов, на выходе — их обфусцированная версия. Но вот пара нюансов:
- Длина результирующих классов должна была получиться минимальной.
- Наиболее часто встречающиеся классы должны были занимать наименьший объём.
3 июля, сделав задания, я отправил заявку и забыл про Школу, а 26 июля мне пришло письмо о том, что я принят. Сегодня хочу рассказать вам о том, как проходил процесс обучения, какие инструменты разработки я открыл для себя и какие задачи нам приходилось с интересом решать.
БЭМ-методология: с чего всё начиналось и зачем это всё нужно
2016-02-04 в 8:14, admin, рубрики: bem, javascript, open source, Yandex, Блог компании Яндекс, БЭМ, Веб-разработка, разработка интерфейсов, фронтенд, Яндекс APIНа Хабре уже много писали о методологии БЭМ, выросшей в Яндексе. И мы решили, что пора системно рассказать о том, откуда она появилась и что сделало БЭМ таким, каким мы его знаем. Думаем, это будет интересно не только тем, кто уже использует БЭМ, но и тем, кто считает, что эта методология не подходит для их проектов. Возможно, они увидят, что мы решали проблемы, похожие на их собственные, и найдут что-то полезное для себя.
Конечно, все началось с собственных потребностей Яндекса. Вместе с тем, как он рос, росло и количество сотрудников, которые занимаются фронтендом. Постепенно команда увеличилась настолько, что стало очевидно — без единых стандартов работать будет сложно. К тому же, мы находимся в офисах Яндекса в разных городах. Возникла идея создать общую методологию, которая поможет организовать процессы в большой команде, работающей над разными проектами. А главное то, что мы хотели не только упорядочить и ускорить разработку, но и снизить порог входа в проект для нового разработчика.
Для чего нужна БЭМ-методология
Какие требования мы сформулировали:
- Разработчик должен понимать свой код (даже вернувшись к нему через год) и код любого программиста в команде БЭМ-проекта.
- Любой блок кода может быть использован повторно: необходимо создать общую базу знаний и не писать каждый раз всё с нуля, а использовать готовые наработки.
- Работая в одной команде, разработчики, менеджеры, дизайнеры и верстальщики должны называть одни и те же вещи одинаково. То есть говорить на одном языке.
- Команды могут обмениваться специалистами для реализации какой-то конкретной функциональности.
- Порог входа при переходе на новый проект должен быть снижен за счет одинаковой структуры организации всех БЭМ-проектов и одинаковых правил именования всех сущностей.
Мы стремились к тому, чтобы с увеличением числа разработчиков улучшалось и качество продукта. Это значит, что разработчики должны быть в курсе работы друг друга и не изобретать заново то, что уже реализовано. Мы хотели создать единую команду, которая работает над разными проектами.
Магия AngularJS: никогда не вешайте binding на примитивы
2014-05-20 в 14:34, admin, рубрики: AngularJS, workaround, разработка интерфейсовМагия AngularJS: никогда не вешайте binding на примитивы
Если вы используете AngularJS, скорее всего вы неоднократно сталкивались с правилом «Не вешайте binding на примитивы». В этом посте я подробно разберу пример, в котором использование примитивов создает проблемы: создание списка элементов , в котором каждый из элементов привязан к строке.
Наш пример
Скажем, вы работаете над приложением с книгами, и у каждой книги есть список тегов. Наивным способом предоставления пользователю возможности редактировать теги будет:
<div ng-controller="bookCtrl">
<div ng-repeat="tag in book.tags">
<input type="text" ng-model="tag">
</div>
</div>