Несколько месяцев назад меня попросили разработать игру с преимущественно векторной графикой и простой 2D-физикой движений и анимаций.
Paper.js я знал только в лицо, поэтому решил протестировать его перед использованием. для бизнес-проекта; для этого я создал эту крошечную 2D гоночную игру.
Посмотреть демо
Исходник на Github
Я хотел частично воссоздать физику и геймплей Гонщика; Я вспомнил этот великолепный эксперимент Chrome, разработанный Active Theory, и вспомнил, что он был разработан в Paper.js, у него была хорошая физика и отличная производительность на мобильных устройствах. Более того (спасибо активным программистам-теоретикам!) Я также нашел этот кейс HTML5 ROCK, отличное место для начала.
Я использовал Paper.js как для проектирования трека путем чтения SVG-файла, созданного в Illustrator, так и для всех расчетов, касающихся скорости, местоположения, вращения, тангенциальной скорости и т. д.
Наконец, я добавил базовый пользовательский интерфейс и некоторые основные логика, чтобы сделать все играбельным.
Рассмотрение и советы
- Кривая обучения Paper.js очень хороша: если вы хотите поиграть с ней, вы получите большое удовлетворение за короткое время;
- Я не особо использовал API для рисования, но примеры на веб-сайтах демонстрируют его невероятный потенциал;
- Что касается векторной математики, все API, которые я ожидал найти, присутствуют и хорошо сделаны, так что палец вверх.
В общем, я настоятельно рекомендую эту библиотеку, идеально подходящую для всех тех проектов, которые требуют серьезного использования графики и векторного исчисления.
еще две вещи
- Я вообще не тестировал код на устаревших браузерах, это то, чем я зарабатываю на жизнь, поэтому стараюсь избегать этого, когда могу :)
- Поэтому я постараюсь избегать JQuery, так как у меня нет проблем с обратной совместимостью, я пытаюсь провести детоксикацию.