Примечание от переводчика: если вам позволяет знание английского языка, то я настоятельно рекомендую ознакомиться с оригиналом. Её автор — один из основателей студии Mode 7, которые выпустили Frozen Synapse. Статья очень большая по объёму текста, поэтому, если у вас не получится осилить её за 1 подход, я бы предложил отложить на потом, и продолжить в другой день.

Мне, как разработчику игр, который старается «копать» в этом направлении уже в течении, наверно, 5 лет или больше, и у которого не получилось добиться хоть сколько-нибудь значимого финансового успеха, статья показалась безумно полезной, т.к. вправляет мозги и делится трезвым взглядом на то, как должна функционировать команда или отдельный разработчик в этом жестоком (но, довольно честном) мире разработки игр.

Ниже будет перевод статьи.

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

Группировка с использованием элемента <g>

Элемент <g> используется для логической группировки набора связанных графических элементов. Это можно сравнить с группировкой объектов в графических редакторах.

Элемент <g> объединяет в группу все свое содержимое. Как правило, ему задается идентификатор, по которому будет производиться обращение в дальнейшем. Любые стили, применяемые к элементу <g>, будут также применены ко всем его потомкам. Это позволяет задавать стили и преобразования, а также добавлять интерактивность и анимацию сразу целой группе объектов.

В качестве примера будем использовать нарисованную в SVG птичку. Она состоит из нескольких отдельных фигур, описываемых кругами и путями. [По невыясненным причинам автором описаны круги путями вместо использования circle, хоть и было обещано использовать круги. Не спрашивайте почему. Я это исправил. Не спрашивайте зачем. — Пер.]

Это третья статья из цикла, посвященного обновлению Windows Phone 8.0 приложений до версии 8.1. На этот раз, мы поговорим про самый сложный сценарий – обновление приложения Windows Phone 8.0 (Silverlight) до Windows Phone 8.1 (XAML). Этот процесс не такой прозрачный и понятный как в случае с Silverlight или Windows Store, где есть специальные действия в Visual Studio (Reterget), чтобы поменять сборки и ссылки на них. В нашем случае, придется пересобрать приложение в ручную для новой версии. Этим мы и займемся.

Если вы разработчик мобильных приложений и у вас уже есть приложения под Windows Phone 8 или более ранние версии OS, вероятно, вы уже начинаете задумываться, стоит ли вам обновлять свои приложения до новой версии, каким образом это проще всего сделать и сколько это может занять времени. Это простые вопросы, для ответа на которые мы опубликуем несколько статей, описывающих основные сценарии обновления в пошаговом режиме.

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

На конференции //build/ у меня был доклад о Visual Studio Web Tools и расширении Web Essentials. Вы можете найти этот доклад онлайн на сайте Channel9. Во время доклада я использовал несколько расширений, которые будут полезными для любого веб-разработчика Visual Studio 2013. Ниже вы найдете список этих расширений.

Web Essentials

Сайт: http://vswebessentials.com
Загрузить: Web Essentials в галерее VS

Это расширение команды ASP.NET и Web Tools, которое является неофициальной площадкой для тестирования и обкатки функций. Само расширение развивается opensource-сообществом. Web Essentials предлагает огромное число новых возможностей для веб-разработчиков, такие как компиляторы LESS/Sass/CoffeeScript, дополнительные возможности работы с кодом JavaScript/CSS/HTML/JSON, валидаторы, генераторы спрайтов изображений и многое другое.

SideWaffle

Сайт: http://sidewaffle.com
Загрузить: SideWaffle в галерее VS

Очень вкусное дополнение для Visual Studio. Это отличный набор шаблонов, который содержит как шаблоны проектов, шаблоны элементов, так и сниппеты для широкого круга сценариев: от создания приложений Angular.js, проектов Nancy FX и до плагинов Browser Link, расширений Chrome и многого другого.

Перед тем как начать писать этот доклад я прочел больше 115 постмортемов и историй инди разработчиков. Что я понял? Во-первых, что мой английский отстой. Во-вторых что инди очень разные. Очень. И чтобы каталогизировать их понадобилась куча времени.

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

В предыдущей статье я рассказал как разработать судоку для windows 8.1, в этой расскажу как портировать приложение на Windows Phone 8 и локализовать его на несколько языков.

Хей народ, пристегните ремни и держитесь покрепче, ибо наступил действительно волнительный момент: вам предстоит разобраться в тонкостях чрезвычайно интересных временных функций CSS!

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

В прошлой статье мы рассмотрели основы шаринга кода. Дополнить эту статью можно продемонстрированной на конференции Build возможностью шаринга между W8.1 и WP8.1. Этот подход очень хорошо описан здесь, поэтому сейчас мы не будем подробно останавливаться на Universal Apps.

В целом Microsoft радует шагами по унификации кода для обеих платформ, однако все же у нас остается наследие в виде Windows Phone 7. Кроме того, возможно, придется шарить код также и на десктоп, Android и т.д.

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

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

Так как материал был достаточно объемным, я решил разбить статью на две части. Сегодня рассмотрим основы шаринга для новичков, и если вы уже имеете базовые навыки, то смело можете пропустить эту статью и дождаться следующей, где мы на практике рассмотрим более сложные сценарии шаринга кода.

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

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

Но прежде чем начать разбираться непосредственно с Audio API, нам необходимо набросать заготовку нашего визуализатора и делать мы будем это при помощи canvas.

Введение

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

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

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

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

Я не хотел принимать участие в недельном тренде хабра — «Все пишем в 30 строк кода!», нет времени лишнего. Но пост theaqua про Hello world в 1 строчку на чистом JavaScript вдохновил меня побить этот рекорд. Я написал игру, используя JavaScript, HTML и CSS, при этом использовал всего 0 строк кода. После этого поста я не мог спать. Я мучался бессоницей и, взяв себя в руки, сел писать игру. Понимая что мне придется использовать 0 строк кода на Javascript — я сильно боялся. Написать программу в 1000 строк кода и больше — не составляет проблем. Но вот написать 0 строк кода… Это безумие. Это переворачивает мозг. Меняет отношение к вебу. Понимаешь, что раньше ты писал как-то не так…

Для тех, кто не привык ждать — ДЕМКА.

Это не фейк, а полноценная игра. Подробности под катом.

Вместо предисловия

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

Некоторое время назад уже был опубликован аналогичный пост, с тех пор количество дополнений для Visual Studio 2010,2012 и 2013 перешагнуло планку в 4к, появилось немало новых дополнений. Ниже перечислено 20 наиболее популярных или интересных расширений для Visual Studio 2012 и 2013 в дополнение к предыдущему посту.

Эта статья посвящена разработке стильных, модных и молодежных HTML5 приложений с помощью нового фреймворка Phaser. В ней описан процесс установки библиотеки и создание классической игры Pong.

Введение

Phaser — это движок для разработки мобильных и десктопных HTML5 игр, базирующийся на библиотеке PIXI.js. Поддерживает рендеринг в Canvas и WebGL, анимированные спрайты, частицы, аудио, разные способы ввода и физику объектов. Исходники доступны как для просмотра, так и для свободной модификации. Он создан Ричардом Дейви (Richard Davey), известному благодаря активному участию в сообществе программистов, использующих Flixel framework. Ричард не скрывает, что вдохновлялся Фликселем, поэтому некоторые вещи в Фазере будут знакомы опытным флешерам. Первая версия нового движка вышла 13 сентября этого года, сейчас ведется не только активное развитие библиотеки, но и написание документации, поэтому в данный момент уроков по ней, мягко говоря, немного. Что, по моему скромному мнению, следует исправлять, и прямо сейчас.

Хватит менять размер окна браузера, хватит его насиловать! Готов спорить, вы не раз слышали это. Хорошо, возможно и не слышали. Но если вы профессионально занимаетесь разработкой адаптивных сайтов, вы понимаете о чем я: любое изменение DOM или правка CSS, и вы снова начинаете тянуть край браузера вперед, назад, тестируя изменения и просматривая ничего ли не сломалось.

Целью ваших движений является имитация экранов различных устройств.

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

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

Для тестирования я выбрал реально адаптивный сайт PajamasOnYourFeet.com, сайт построено на основе HTML5 шаблона, бесплатно предоставленным EGrappler.

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