three.js

  • ХабрахабрФото [Перевод] Овладейте всем потенциалом анимирования с Vue

    [Перевод] Овладейте всем потенциалом анимирования с Vue

    Vue позволяет разработчикам писать более гибкий и переиспользуемый код за счёт наличия дополнительных возможностей для организации компонентов. И одной из областей применения этих возможностей являются анимации. В текущей статье мы разберём использование Composition API для создания анимаций в Vue с помощью CSS и JS библиотеки GSAP (GreenSock Animation Platform). Примечание пер.: статья содержит крупные GIF-анимации. Для начала мы рассмотрим принцип…

    Читать далее »
  • ИгрыФото Конструктор базы для браузерной стратегии в духе Dune 2/2000 на Three.js, Vue3 + TS

    Конструктор базы для браузерной стратегии в духе Dune 2/2000 на Three.js, Vue3 + TS

    Олды здесь? ) Самой успешной моей статьей для сообщества был подробный отчет о разработке браузерного FPS. Судя по статистике в базе данных — неожиданно огромное количество людей зашло и попробовало сыграть, я получал заинтересованные вопросы в личку и так далее. В дальнейшем я сделал еще одну попытку крафтового браузерного геймдева на javascript и попробовал создать конструктор для стратегии в духе…

    Читать далее »
  • ХабрахабрФото React: работа с 3D-графикой

    React: работа с 3D-графикой

    Привет, друзья! В данном туториале я покажу вам самый простой и быстрый, хотя и не очень оптимальный с точки зрения размера сборки, способ рендеринга 3D-объектов и моделей в React. Мы решим 3 интересные задачи: рендеринг самописного 3D-объекта; рендеринг готовой 3D-модели; совместный рендеринг объекта и модели. Знание вами основ работы с трехмерной графикой в браузере является опциональным. Источником вдохновения для меня…

    Читать далее »
  • ХабрахабрФото «Йо-хо-хо»-2 или перевозка рабов и трупов оппозиционеров

    «Йо-хо-хо»-2 или перевозка рабов и трупов оппозиционеров

    Я продолжаю работу над своей браузерной игрой про пиратов на Three.js. Пришло время добавить торговлю. Я подумал, раз у нас тут век пиратов, то и в политическом смысле обстановка должна быть весьма фривольной, то есть, без всякой богомерзкой демократии. А чего стесняться? Заходим в порт, а там нам, пиратам, сразу же предлагают приобрести пушечные ядра и выполнить заказы на транспортировку…

    Читать далее »
  • ХабрахабрФото [Перевод] Как создать игру Tetris с помощью Three.js

    [Перевод] Как создать игру Tetris с помощью Three.js

    Вспомните, как мы играем в «Тетрис». При движении блока мы свободно перемещаем и вращаем его. Кубы, из которых состоят блоки, соединены, поэтому должно быть соединено и их описание в коде. С другой стороны, когда мы завершаем горизонтальный срез (в 2D это строка), кубы удаляются и блок, к которым они принадлежали, на этом этапе уже не важны. На самом деле, они…

    Читать далее »
  • ХабрахабрФото [Перевод] Как создать игру Tetris с помощью Three.js

    [Перевод] Как создать игру Tetris с помощью Three.js

    Вспомните, как мы играем в «Тетрис». При движении блока мы свободно перемещаем и вращаем его. Кубы, из которых состоят блоки, соединены, поэтому должно быть соединено и их описание в коде. С другой стороны, когда мы завершаем горизонтальный срез (в 2D это строка), кубы удаляются и блок, к которым они принадлежали, на этом этапе уже не важны. На самом деле, они…

    Читать далее »
  • ХабрахабрФото [Перевод] Как создать игру Tetris с помощью Three.js

    [Перевод] Как создать игру Tetris с помощью Three.js

    Вспомните, как мы играем в «Тетрис». При движении блока мы свободно перемещаем и вращаем его. Кубы, из которых состоят блоки, соединены, поэтому должно быть соединено и их описание в коде. С другой стороны, когда мы завершаем горизонтальный срез (в 2D это строка), кубы удаляются и блок, к которым они принадлежали, на этом этапе уже не важны. На самом деле, они…

    Читать далее »
  • ХабрахабрФото Браузерная игра про пиратов

    Браузерная игра про пиратов

    Какой-то остров «Йо-хо-хо!» - невольно приходит на ум при любом взаимодействии с морем, передвигаешься ли на речном трамвайчике или же сидишь в баре круизного корабля. В последнем случае еще можно приобрести бутылку рому. Море привлекает своими волнами, закатами и рассветами. А особенно прикольно, когда на море завелись злые пираты. Ну... если это мы, конечно же. Возьмем шейдер неба и шейдер…

    Читать далее »
  • ХабрахабрФото [Перевод] Самопаркующаяся тачка в 500 строк кода

    [Перевод] Самопаркующаяся тачка в 500 строк кода

    С помощью генетического алгоритма натренируем тачку парковаться самостоятельно. Вкратце В этой статье мы "научим" автомобиль выполнять самостоятельную парковку с помощью генетического алгоритма. В 1-м поколении автомобили будут иметь случайный геном и будут вести себя хаотично, приблизительно вот так: В ≈40-м поколении автомобили понемногу начнут учиться парковке и будут все ближе и ближе подбираться к парковочному месту, Еще один пример с более сложным стартовым…

    Читать далее »
  • ХабрахабрФото [Перевод] Как на Three.Js сделать анимированный туннель из частиц

    [Перевод] Как на Three.Js сделать анимированный туннель из частиц

    Один из организаторов митапов для креативных разработчиков в Бельгии Creative Front-end Belgium в двух постах на CodePen рассказывает и показывает, как шаг за шагом сделать туннель из частиц с эффектом движения в нём. К старту курса по Frontend-разработке делимся сокращённым переводом этих статей об анимации, которая, по словам автора, нравится ему больше всего; вы увидите эксперименты с параметрами анимации, поэтому…

    Читать далее »


Кнопка «Наверх»