Creative Coder
447 subscribers
198 photos
137 videos
4 files
330 links
Креативна розробка вебу з ароматом смаженої москальні. Передовий край веб технологій та дизайн ідей, поки є електрика :)

@dre1337
加入频道
This media is not supported in your browser
VIEW IN TELEGRAM
Кажется, это тот самый случай, когда эффекты используются только ради эффектов. Элементарная сборка подошвы при скролле несёт в себе больше смысла чем большая часть эффектов на WebGL. Да, это реализация концепта, да, это хорошие решения в его рамках, но по мне это всё как-то не секси.

А макет крутой)

https://www.awwwards.com/case-study-cobo.html

#article
This media is not supported in your browser
VIEW IN TELEGRAM
Как создавался https://fiomet.com/

По мне это очень крутой кейс и статья раскрывает достаточно подробностей.
Рекомендую прочитать:

https://medium.com/active-theory/fiomet-case-study-9a0180268423

#article #reference
Рубрика почитать на выходных:

Исследование читаемости шрифтов

Засечки вс гротески. Если вкратце – по читаемости шрифты без засечек чуть-чуть лучше, шрифты с засечками вызывают чуть-чуть более выраженный эмоциональный отклик.

https://habr.com/ru/company/tinkoff/blog/498878/

#article
Создание интерфейса для игры

Просто статья о процессе создания интерфейса, nothing special.

https://habr.com/ru/post/498600/

К ней прилагаются референсы игровых магазинов и визуального стиля из игр:
https://www.figma.com/file/zNQ09f97jPyl4bFkZtb1tS/GUI_Process_Tutorial
https://www.figma.com/file/WOLAP66uHyUBRj2tnuKY15/GUI_VISUAL_STYLE_REFS (тут бонусные скрины из SC2)

#article #reference
3D-аркада в браузере: как мы сделали игру на React + Redux

Статья о том, как НЕ надо делать 3D игры. Ну или как поднять перформанс Redux

https://habr.com/ru/company/2gis/blog/498638/

#article
И последняя, золотая статья аж 2015го года:

GTA V - Graphics Study

Разбор техник применяемых при рендеринге в GTA V в трёх частях.

В блоге ещё несколько разборов рендеринга в ААА играх. Не веб конечно, но отдельные техники применять можно и в WebGL. Adrian Courrèges, ты крутой, спасибо!

http://www.adriancourreges.com/blog/2015/11/02/gta-v-graphics-study/

#article #top
Анализ кадра Mortal Kombat 11

Коненчо, для веба это слишком хардкорно, а для WebGL скорее невозможно, но даже если не знать все эти техники, то хотя бы иметь представление об их существовании полезно. Тем более вон в твиттере уже screen space GI на WebGL сделали)

https://habr.com/ru/post/500840/

#article
Прекрасная статья про свет и тени в компьютерной графике:

https://ciechanow.ski/lights-and-shadows/

#article
Очень крутая техника объёмного рендеринга

https://habr.com/ru/post/500914/

Для оптимизации автор использует мои любимые ray-surface instersectors где это возможно, дым приходится реймарчить. В статье также описан процесс полировки результата, а это самый сок :)

И там же есть шейдертой. Если поставить PERFORMANCE_MODE 1, оно даже летает на полном экране, ценой появления незначительных артефактов. Собственно в прикреплённых видео показаны оба режима 😉

Если кто-то знает крутых математиков умеющих интегрировать SDF c fBM по прямой — пишите, создадим крутую технологию 😊 В теории можно будет избавиться от реймарчинга и получить высокую производительность.
Мечты, мечты...

#reference #article
Дуже круте відео, що на пальцях пояснює метод Ейлера та як запобігти деяким проблемам при його впроважденні

https://www.youtube.com/watch?v=KPoeNZZ6H4s

Навіщо це знати веб розробникам? Власне щоб надати своїм сайтам більше інтерактивності, анімуючи елементи не за допомогою gsap і заздалегідь заданих ізингів, а розраховуючи реальну фізику. Дрібниця, яку скоріше не помітять, але відчують :)

#article
Будь-якій інженерній споруді потрібна міцна база, фундамент на якій буде заснована вся конструкція. Тому в комп'ютерній графіці важливо розібратися в засадах, зрозуміти математичний інструментарій. З цією метою добре підійде канал від проффесора Університету Юти Cem Yuksel (я називаю його чувак у червоній майці).

На каналі представлені плей-лист за загальною теорією та Interactive Computer Graphics.
https://www.youtube.com/@cem_yuksel

До речі, він відповідає на коментарі під відео 😉

#article
Чудові статті про комп'ютерну графіку

https://www.scratchapixel.com/index.html

#article