Дайджест свежих материалов из мира фронтенда за последнюю неделю №257 (3 — 9 апреля 2017)

Автор: admin от 10-04-2017, 01:35, посмотрело: 257

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.

Дайджест свежих материалов из мира фронтенда за последнюю неделю №257 (3 — 9 апреля 2017)

Категория: Программирование » Веб-разработка

 

CSS Grid Layout. Быстрый старт

Автор: admin от 7-04-2017, 17:00, посмотрело: 776

CSS Grid Layout. Быстрый старт

Вступление


Всем привет. Февраль-Март 2017 года запомнились для многих, кто работает с HTML и CSS тем, что большинство браузеров выпустили обновления, среди которых были и обновления для CSS. Теперь можно использовать спецификацию CSS Grid Layout без флагов в следующих браузерах: Firefox 52, Chrome 57, Opera 44, Safari 10.1. Какой из браузеров остался позади, думаю, вы догадываетесь. Точнее он поддерживает старую версию спецификации. Но разработчики этого браузера делают все возможное, чтобы внедрить новую спецификацию. Внедрение поддержки новой CSS Grid Layout спецификации — это самое значимое событие за прошедшие пять лет. Эта спецификация поменяет полностью подход к разработке пользовательских интерфейсов. И это круто.

Категория: Программирование » Веб-разработка

 

Хватит дизайнить в скетче. Делайте дизайн в браузере

Автор: admin от 7-04-2017, 12:05, посмотрело: 233

Если вы тратите большую часть своего времени в статичных инструментах, таких как Sketch, то вам стоит переехать в браузер и чем раньше, тем лучше.



Более трех лет назад я написал свой первый пост на тему «Дизайн в браузере». Пост назывался «Как я задизайнил сайт без Фотошопа»

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

Хватит дизайнить в скетче. Делайте дизайн в браузере

Категория: Программирование » Веб-разработка

 

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017)

Автор: admin от 2-04-2017, 22:25, посмотрело: 241

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017)

Категория: Программирование » Веб-разработка

 

Создание вашей первой игры на Phaser. Часть 3 — Создание игрового мира

Автор: admin от 1-04-2017, 11:25, посмотрело: 450

Создание вашей первой игры на Phaser. Часть 3 — Создание игрового мира


Оглавление


0. Подготовка к работе
1. Введение
2. Загрузка ресурсов
3. Создание игрового мира [Вы тут]
4. (wip) Группы
5. (wip) Мир физики
6. (wip) Управление
7. (wip) Добавление целей
8. (wip) Последние штрихи


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


Не забывайте читать комментарии в коде, они важны!


Весь код, как и в прошлый раз, лежит в Github репозитории с тегом part-3.

Категория: Веб-разработка, Game Development

 

Создание вашей первой игры на Phaser. Часть 2 — Загрузка ресурсов

Автор: admin от 30-03-2017, 08:40, посмотрело: 516

Создание вашей первой игры на Phaser. Часть 2 — Загрузка ресурсов


Оглавление


0. Подготовка к работе
1. Введение
2. Загрузка ресурсов [Вы тут]
3. (wip) Создание игрового мира
4. (wip) Группы
5. (wip) Мир физики
6. (wip) Управление
7. (wip) Добавление целей
8. (wip) Последние штрихи


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


Как и в прошлых статьях, не пропускайте комментарии в коде.


Полный код, написанный в этой статье, вы найдете в Github репозитории с тегом part-2.


Приступим!

Категория: Веб-разработка, Game Development

 

Создание вашей первой игры на Phaser. Часть 1 — Введение

Автор: admin от 27-03-2017, 00:30, посмотрело: 637

Создание вашей первой игры на Phaser. Часть 1 — Введение


Оглавление


0. Подготовка к работе
1. Введение [Вы тут]
2. (wip) Загрузка ресурсов
3. (wip) Создание игрового мира
4. (wip) Группы
5. (wip) Мир физики
6. (wip) Управление
7. (wip) Добавление целей
8. (wip) Последние штрихи


Добро пожаловать в наш первый урок по созданию игр на Phaser. Здесь я расскажу вам, как создать небольшую игру — платформер, которая познакомит вас с основными функциями данного фремворка и работу с ним в нынешних реалиях (ES6 / TypeScript + WebPack).


Что такое Phaser?


Phaser — это HTML5 (javascript / TypeScript) игровой фреймворк, который призван помочь разработчикам создавать крутые, кросс-браузерные HTML5 игры в короткие сроки и, в отличии от других фреймворков, phaser изначально затачивался под мобильные устройства. Единственное требование выдвигаемое данным фреймворком — поддержка тега . Он также много чего унаследовал от Flixel.

Категория: Веб-разработка, Game Development

 

Дайджест свежих материалов из мира фронтенда за последнюю неделю №255 (20 — 26 марта 2017)

Автор: admin от 26-03-2017, 23:00, посмотрело: 268

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.

Дайджест свежих материалов из мира фронтенда за последнюю неделю №255 (20 — 26 марта 2017)

Категория: Программирование » Веб-разработка

 

Учимся мыслить в REM. Разговор об очевидном и о производительности труда в небольшой веб-студии

Автор: admin от 25-03-2017, 09:05, посмотрело: 260

Учимся мыслить в REM. Разговор об очевидном и о производительности труда в небольшой веб-студии


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

Категория: Программирование » Веб-разработка

 

Проектирование анимации или как я в дизайнерскую авантюру ввязался

Автор: admin от 24-03-2017, 06:00, посмотрело: 259

Проектирование анимации или как я в дизайнерскую авантюру ввязался

Вот уже неделя с небольшим минула, как я решил ввязаться в дизайнерскую авантюру! Daily UI это опциональный челлендж для любого профессионального графического разработчика. Каждый день — новый дизайн. Чего угодно: кнопки, таблички, хедеры, карточки, да любой элемент вплоть до целого раздела. По итогам этого “марафона”: во-первых, прокачиваются навыки; во-вторых, прокачивается карма и последователи; в-третьих, да мало ли к каким интригующим последствиям это может привести. Обычно такой марафон длится 100 дней.

Однако, я немного адаптировал условия этого личного соревнования под себя. Количество дней не ограничиваю, в выходные отдыхаю, а результатом каждого дня будет не *.sketch / psd исходники, а HTML/CSS/JS файлы. И, да, вы всё это можете скачать и применять для своих нужд. Именно поэтому в выходные я и отдыхаю! Всё ясно? :)

Тогда читайте дальше...

Категория: Программирование » Веб-разработка