Pull to refresh
MniD @MniD read-only

User

GIF изнутри

Algorithms *Image processing *
Sandbox

Вам когда-нибудь было интересно, как устроены gif-ки? В данной статье попробуем разобраться с внутренним строением GIF-формата и методом сжатия LZW.

Структура GIF


Файл в формате GIF состоит из фиксированной области в начале файла, за которой располагается переменное число блоков, и заканчивается файл завершителем изображения.


Читать дальше →
Total votes 80: ↑74 and ↓6 +68
Views 51K
Comments 17

Обзор физики в играх Sonic. Часть 1: твердые тайлы

Programming *Game development *Algorithms *
Translation
image

От переводчика: этот пост — перевод одной из частей масштабного обзора физики (Sonic Physics Guide) в играх серии Sonic the Hedgehog для Sega Genesis/Mega Drive и Sonic CD. В следующих частях рассматриваются такие темы: бег, прыжки, вращение, потеря колец, поведение под водой, суперскорость, специальные возможности, камера, анимации и некоторые другие. Так как частей много (14 штук), в конце поста я добавил опрос. Стоит ли продолжать — решать вам.
Читать дальше →
Total votes 51: ↑51 and ↓0 +51
Views 43K
Comments 5

Специалисты Emsisoft обнаружили вымогатель на JavaScript

ESET NOD32 corporate blog
Специалисты компании Emsisoft обнаружили вредоносную программу — вымогатель, которая написана на JavaScript. Она получила название Ransom32 и используется злоумышленниками для вредоносных кампаний, аналогичных распространению многих других семейств такого типа вредоносного ПО. Злоумышленники выбрали высокий уровень анонимности для работы с Ransom32, для связи со своим управляющим C&C-сервером вымогатель использует анонимную сеть Tor, а оплата выкупа осуществляется в биткоинах.



Использование JavaScript делает вымогатель кроссплатформенным, он может использоваться как для Microsoft Windows, так и для Linux и Apple OS X. Ключевой особенностью Ransom32 является модель распространения этого вымогателя для киберпреступников. Она представляет из себя модель Software as a service (SaaS), при этом для получения доступа к административной панели управления вредоносной программой и ее генерации, им нужно всего лишь указать адрес своего кошелька Bitcoin.

Читать дальше →
Total votes 23: ↑22 and ↓1 +21
Views 20K
Comments 30

Да пребудет с вами прокрутка: теория и практика по камере в платформерах [2/2]

Working with 3D-graphics *Interfaces *Usability *
Tutorial
Translation
Первая часть

От переводчика. OlegKozlov рассказал о приёмах камеры в своей игре «Несыть». Из-за большого количества трафика и не слишком верно действующего JS якорь перебрасывает куда угодно, только не на комментарий, поэтому сделаю копию здесь.
Что сделано в «Несыти»…
1. Упреждение по движению: точка привязки камеры вынесена вперёд от центра червя, причём чем быстрее он ползёт, там дальше она выносится.
2. Упреждение по управлению: когда игрок начинает сжимать червя для прыжка, то вынос точки привязки камеры ещё усиливается заранее передвигая камеру в ту область, куда червь сейчас прыгнет.
3. Линейное сглаживание — камера плавно стремится к точке своей привязки, тем быстрее, чем больше разница между фактическим положением камеры (центра экрана) и точкой её привязки.
4. Плюс масштаб всего происходящего завязан на размер червя, когда червь увеличивается, то камера «отъезжает». Причём делает это тремя-четыремя ступенчатыми переключениями, чтобы игрок ощущал, что его червь вырос. Если делать плавно, то рост и изменение масштабов игры нивелируются и не приносят удовольствия.
5. Упор в край. Камера «упирается» в края уровня, становясь более статичной и позволяя голове червя сильно смешаться от центра экрана, буквально упираться головой в его край.
image

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

Направление


Подсказываем, куда идти, близко ли цель и что рядом важного

Мы уже рассмотрели, как сделать, чтобы поле зрения игрока соответствовало управлению, и как показать то, что игрок хочет видеть — в нашем треугольнике это взаимодействие. Также мы осветили множество способов сделать прокрутку ненавязчивой, но действенной (комфорт). Теперь, как режиссёры игры, попробуем обратить внимание публики на то, что мы сами хотим ей показать — то ли ради контекста, то ли чтобы подчеркнуть течение игры, то ли ради драмы и сюжета.

Wonder Boy, ещё одна моя любимица, быстрый платформер, в котором можно идти только вперёд через старое доброе одностороннее окно свободного хода. В отличие то Super Mario Bros., там нет зоны разгона, плавно ускоряющей камеру, но есть другая интересная техника, которую я называю «рельсы». Камера ставится и движется так, чтобы предвосхищать будущие преграды.

Wonder Boy (Sega, 1986)
Рельсы: запрограммированный маршрут камеры
Зона свободного хода (односторонняя)
Статическое упреждение

Пятое поколение приставок, среди них PlayStation и Nintendo 64, открыло новые аппаратные возможности, положив начала грубому, но настоящему 3D. Приёмы трёхмерной камеры — сами по себе захватывающая и многогранная тема, но поддержка 3D повлияла и на двухмерные игры. Разработчики теперь могут приближать камеру, наклонять вид и даже сочетать 2D и 3D — то, что мы сейчас называем 2,5D, когда игра идёт на двухмерной плоскости, но в объёмном мире.
Очень много трафика...
Total votes 64: ↑62 and ↓2 +60
Views 29K
Comments 10

Создание веб-сайта. Курс молодого бойца

Website development *CSS *JavaScript *HTML *
Sandbox
Как-то меня попросили провести небольшой семинар в лицее, где я когда-то учился, по созданию веб-сайта. В процессе написания речи я подумал, что она может вылиться в материал, который, возможно, будет полезен многим начинающим в области веб-дизайна, вёрстки веб-страниц и пр. Я не претендую на истину в первой инстанции и всё изложенное носит чисто личностный взгляд на работу с дизайном и кодом. Статья даёт поверхностный взгляд на понятия и средства, которые, на мой взгляд, могут стать неплохим стартом для того, кто готов идти дальше.
Читать дальше →
Total votes 86: ↑77 and ↓9 +68
Views 700K
Comments 46

Да пребудет с вами прокрутка: теория и практика по камере в платформерах [1/2]

Working with 3D-graphics *Interfaces *Usability *
Tutorial
Translation
Вторая часть

От переводчика. Статью написал Итай Керен, основатель инди-студии Untame, автор игры Mushroom 11. Получился настоящий учебник по управлению камерой в играх с боковой прокруткой. Хоть там нет ни строчки кода ни на каком языке (вру, одна есть), думаю, несложно будет перевести всё это в инструкции для компьютера. Обязательно к прочтению всем программистам и дизайнерам, которые занимаются динамичными 2D-играми. Терминологию я переводил больше по смыслу: например, position-locking — «привязанная камера». Да, и для многих игр до 1983 года показана версия для Dendy — немного неисторично, но простим.

Введение




Работая над игрой Mushroom 11, я натолкнулся на множество дизайнерских и технических вопросов. Я не рассчитывал, что кто-то напишет о вершинной анимации или плавном изменении формы, но я удивился, что по работе с камерой, задаче с 30-летней историей, тоже практически не пишут.

Я решил устроить небольшое путешествие по истории двухмерных игр, задокументировать их трудности, подходы и эволюцию их решений. У многих решений нет даже названия, так что я — скорее для себя — придумал классификацию подходов к камере и написал небольшой словарик.
Читать дальше →
Total votes 48: ↑48 and ↓0 +48
Views 37K
Comments 19

Web без мышки

Netcracker corporate blog Usability *Accessibility *
Наверное, все при взгляде на этот экран мысленно переносят обе руки на клавиатуру. Да, тут можно было навигироваться без мышки и это было быстро и хорошо! Многие до сих пор используют подобные менеджеры (Total commander, Far etc).

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

Как же достичь удобства навигации без мышки в вебе?
Вернуть клавиатуру в веб
Total votes 41: ↑33 and ↓8 +25
Views 42K
Comments 69

Как работать с тайм-аутами соединения: Кейс Ticketmaster

1cloud.ru corporate blog System administration *IT Infrastructure *Server optimization *Server Administration *
Мы постоянно делимся опытом оптимизации служебных систем нашего IaaS-провайдера:


Сегодня наше внимание привлек кейс Ticketmaster. Попробуем кратко его проанализировать.


Читать дальше →
Total votes 11: ↑11 and ↓0 +11
Views 4.2K
Comments 4

Обновление React компонентов с сохранением состояния в режиме реального времени для Browserify

Website development *JavaScript *Programming *ReactJS *


Всем доброго времени суток!
Давайте немного поговорим о DX (Developer Experience) или «Опыте разработки», а если конкретнее — об обновлении кода в режиме реального времени с сохранением состояния системы. Если тема для вас в новинку, то перед прочтением советую ознакомиться со следующими видео:

Ряд видео с обновлением кода в реальном времени без перезагрузки страницы




Введение: Как это работает?


Прежде всего стоит понимать, что реализация подобной функциональности подразумевает под собой решение ряда задач:
— Отслеживание изменений файлов
— Вычисление патча на основании изменений файлов
— Транспортировка патча на клиент (в браузер, например)
— Обработка и применение патча к существующему коду
Но обо всём по порядку.
Читать дальше →
Total votes 8: ↑8 and ↓0 +8
Views 14K
Comments 8

Обзор новшеств Docker Engine с 1.0 до 1.7. Введение в Docker Compose

Infobox corporate blog
В прошлых статьях мы уже рассматривали что такое Docker и как использовать Dockerfile и осуществлять коммуникацию между контейнерами.



Эти статьи были написаны по Docker 1.1.2. С тех пор в Docker появилось много полезного, о чем мы расскажем в этой статье. Также мы рассмотрим подробнее Docker Compose, утилиту, позволяющую определять мультиконтейнерное приложение со всеми зависимостями в одном файле и запускать это приложение в одну команду. Примеры будут продемонстрированы на облачном сервере в InfoboxCloud.
Читать дальше →
Total votes 24: ↑23 and ↓1 +22
Views 27K
Comments 9

«Галоп пикселя — часть вторая» — перспектива, цвет, анатомия и прикладные упражнения

Game development *Image processing *
Tutorial


«Галоп пикселя», часть I — базовые понятия, этапы взросления, прикладные упражнения (линк)
«Галоп пикселя», часть II — перспектива, цвет, анатомия и прикладные упражнения (линк)
«Галоп пикселя», часть III — Анимация (линк)
«Галоп пикселя», часть IV — Анимация света и тени (линк)
«Галоп пикселя», часть V — Анимация персонажей. Ходьба (линк)линк)

Первая статья данного цикла была воспринята тепло, вследствие чего затягивать с продолжением не имело никакого смысла, но, увы – это произошло. Зимнее наступление захлебнулось и плавно переросло в летнюю кампанию. В конце статьи я объясню почему, не хотелось бы вас огорчать с самых первых строк. Итак. Публика выразила желание ознакомиться с предметом глубже, чем предполагалось изначально. Большое количество писем пришло на почту, наряду с регулярными тычками в социальных сетях. В этом месте мне вспоминается одна фраза – «будьте осторожны в своих желаниях».

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

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


Лопатить пиксели
Total votes 112: ↑110 and ↓2 +108
Views 83K
Comments 27

JPEG 2000, JPEG-XR и WebP в стране упущенных возможностей

.io corporate blog PHP *Image processing *
Ни для кого не секрет, что первым пунктом в оптимизации сайтов стоит графика. Потому многие крупные корпорации годами пыхтят над разработкой оптимальных форматов, в перспективе способных заменить существующие и разом осчастливить и разработчиков, и пользователей. Но лягушка все никак не превратится в царевну, и в распределении форматов по сети из года в год ничего интересного не происходит:



Попробуем разобраться, почему JPEG 2000, JPEG-XR и WebP все еще пасут задних, и действительно ли они такие классные, как заявлено.
Читать дальше →
Total votes 40: ↑34 and ↓6 +28
Views 76K
Comments 35

Минимальный почтовый сервер на основе Postfix и Dovecot. Часть 2: Postfix

Configuring Linux *System administration **nix *Server Administration *
Tutorial
Цель осталась прежней: получить минимально работающий почтовый сервер, используя только Postfix и Dovecot, с минимальным изменением настроек по умолчанию.
Вводная часть и настройка Dovecot.
Читать дальше →
Total votes 16: ↑15 and ↓1 +14
Views 100K
Comments 19

Native Script. Один код для всех платформ

Website development *CSS *JavaScript *Development of mobile applications *
Sandbox
image

Native script (NS) – это библиотека, позволяющая делать кросс-платформенные приложения, используя XML, CSS, JavaScript. Native script решает ту же задачу, что и уже всем известный phonegap (создание кросс-платформенных приложений), но подходы у них разные. Phonegap использует движок браузера, чтобы отобразить ваш UI (фактически вы получаете веб-страницу), Native script использует нативный рендеринг, использует элементы нативного UI. Следующее важное отличие: чтобы получить доступ к камере, gps и так далее в phonegap необходимо устанавливать плагины, в то время как NS дает доступ из коробки.
Читать дальше →
Total votes 29: ↑27 and ↓2 +25
Views 59K
Comments 23

Редизайн Вконтакте под 1440пк+

Web design *Interfaces *Usability *
Рунет беден обзорами редизайна известных сайтов и сервисов. Эта статья не ради того, чтобы это исправить. Моя цель обсудить с сообществом решение одной из проблем веб-версии Вконтакте.



Читать дальше →
Total votes 67: ↑43 and ↓24 +19
Views 56K
Comments 91

Видеонаблюдение через 3/4G (часть 1)

System administration *IT Infrastructure *Network technologies *
Sandbox
Доступ к устройствам, подключенным к Интернет через сеть мобильного оператора возможен в настоящее время только с использованием технологии обратного VPN. Поэтому, для организации удаленного видеонаблюдения через сети 3G/4G нам необходимы два компонента:
  • Маршрутизатор с поддержкой протокола туннелирования. В нашем варианте это VPN — OpenVPN.
  • Сервер, который будет принимать подключения от удаленных 3/4G и предоставлять к ним доступ для клиентов из сети Интернет.

В данной статье мы рассмотрим настройки маршрутизатора на стороне веб-камеры (DVR).
Читать дальше →
Total votes 10: ↑8 and ↓2 +6
Views 42K
Comments 8

Ghostlab: использование инструментов разработчка Chrome для отладки в любом браузере

Website development *Development of mobile applications *Browsers

Практически все современные браузеры обладают инструментами для веб разработчика позволяющими редактировать DOM, CSS и отлаживать JavaScript.

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

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

Решение которое я нашел для себя, позволяющее проводить отладку сразу в нескольких браузерах и на нескольких устройствах, я хочу описать под катом.
Читать дальше →
Total votes 12: ↑9 and ↓3 +6
Views 31K
Comments 8

Построение признаков и сравнение изображений: локальные признаки. Лекции от Яндекса

Яндекс corporate blog Programming *Algorithms *Image processing *
Сегодня мы публикуем пятую лекцию из курса «Анализ изображений и видео», прочитанного Натальей Васильевой в петербургском Computer Science Center, который создан по совместной инициативе Школы анализа данных Яндекса, JetBrains и CS-клуба. Всего в программе девять лекций, из которых уже были опубликованы:

  1. Введение в курс «Анализ изображений и видео».
  2. Основы пространственной и частотной обработки изображений.
  3. Морфологическая обработка изображений.
  4. Построение признаков и сравнение изображений: глобальные признаки.



Под катом вы найдете план этой лекции, слайды и подробную расшифровку.
Читать дальше →
Total votes 38: ↑35 and ↓3 +32
Views 16K
Comments 1

Создаем полностью автоматическую ферму (готовая реализация)

Хакспейс клуб «minirobot» corporate blog Website development *Programming *
Продолжаем обзор деятельность нашего Хакспейс-клуба.

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

7 экспериментальных образов, т.е. куры обычные (возраст 4 месяца, девочки), были запущены для ПМЖ в клетку оборудованной всем необходимым для жизнеобеспечения. Петуха решили не селить к птичкам, все же курортная зона и его запевы по утрам многим не понравятся.

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


Под катом мало слов, много фото и видео.
Читать дальше →
Total votes 58: ↑57 and ↓1 +56
Views 72K
Comments 107

Information

Rating
Does not participate
Location
Одесса, Одесская обл., Украина
Registered
Activity