Меня спросили, как я внедряю прочитанные советы в свою жизнь. Отвечаю.
Сначала кратко расскажу о методе ведения заметок.
Я читаю книги чаще всего на телефоне, реже в бумаге. Интересные идеи выделяю, а после прочтения переношу в отдельный файл моей базы знаний в Notion. Дальше группирую все заметки по темам и отмечаю ключевые идеи.
Первая — готовность получать гонорар по результатам своего труда. То есть, если понравилось — заплатите деньги, если нет — «на нет и суда нет». Это приводит в подавляющем большинстве случаев к ситуации, когда деньги заказчиком не платятся и проект заканчивается разводом, иногда конфликтным. Важно понимать, что работа над проектом — это совместные усилия дизайнера и…
Кадр из научно-фантастического сериала «Звёздный путь» (Star Trek. USA) Я бы выстроил ошибки в следующей иерархии по уровню критичности. Первая — готовность получать гонорар по результатам своего труда. То есть, если понравилось — заплатите деньги, если нет — «на нет и суда нет». Это приводит в подавляющем большинстве случаев к ситуации, когда деньги заказчиком не платятся и проект заканчивается разводом, иногда конфликтным. Важно…
Путь дизайнера к результату может отличаться от проекта к проекту. Работа с референсами и целенаправленный поиск. Уйти подумать и что-то вспомнится само. Случайно увидеть какую-то картинку и услышать щелчок в голове — это оно. Я думаю, путь к решению в графическом дизайне скорее нелинейный. Он включает в себя «интуицию», «импульс», «инстинкт» или «озарение». Часто уже…
Идея проекта “Стоковая фотография вчера и сегодня” — первое глубокое исследование основных перемен в эстетике стоковой фотографии за последние десятилетия. Мы хотели на своем примере показать путь от постановочных съемок с обильной постобработкой до искренних и оригинальных снимков, рассказать о том, что и как на это повлияло. Для этого мы привлекли контент-кураторов и профессиональных стоковых…
Ежегодно дизайнеры составляют длинные списки трендов в разработке логотипов. Минимализм, градиенты, геометрические формы — эти тенденции по-прежнему не теряют актуальности. Но в этом году вперёд вырвалась анимация! Всё больше заказчиков хотят видеть «ожившие» логотипы, которые вращаются, отскакивают, складываются или трансформируются другим образом. В статье рассказываем, почему эти логотипы крутые и как научиться их делать. Всё…
Как вариант, можно пойти дизайнером в департамент маркетинга “Роснефти” или “Газпроме”, но вряд ли это удастся, если у вас там нет дяди на топовой должности. Что же делать? Мой совет такой: либо увеличивать стоимость своего чека, либо увеличивать скорость работы. В идеале — надо увеличить и то, и другое. Миф о том, что заказчик априори…
Коллекция кодов three.js (библиотека Javascript 3D) примеров . Обновление коллекции сентября 2018 года. 12 новых предметов.
Этот простой интерактивный фон создается с помощью ThreeJS и геометрии PlaneBufferGeometry, анимированной с помощью симплексного шума.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: three.js, simplex-noise.js, chroma.js
Простой 3D-эффект раскрытия. Этот простой эффект создается с помощью ThreeJS и TweenMax.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: bootstrap.css, three.js, tweenmax.js
Ваша мышь (или палец) будет падающей звездой. Вы можете изменить размер, скорость и т. Д., Изменив параметры.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: three.js, dat.gui.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js
О коде
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js, tweenmax.js
О коде
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js, tweenmax.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js, tweenmax.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: three.js, tweenmax.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: нет
Зависимости: three.js, tweenmax.js, perlin.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: three.js, ccapture.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Отзывчивый: Да
Зависимости: three.js, ccapture.js
О коде
3D сосна с тройкой.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, OBJLoader.js, MTLLoader.js, BVHLoader.js
О коде
Три.js OBJ дерево.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, OBJLoader.js, MTLLoader.js
Ripple мышь с тройным фокусом.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: ccapture.js
Большинство вещей здесь — просто самозагрузка. По сути это просто
настраивая ThreeJS так, чтобы он представлял плоскую поверхность для рисования
шейдер Единственное, что здесь можно увидеть — это форма, отправленная
шейдер Кроме того, все волшебство происходит в представлении HTML
под фрагментом шейдера.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: ccapture.js
Текст с измененным размером частиц с Three.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, GeometryUtils.js, TweenMax.js
3D city — эксперимент с Three.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: constants.js, TweenMax.js
Отзывчивый слайдер частиц (flickity.js) с библиотекой three.js .
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: flickity.css, flickity.js
Raycaster — эксперимент с Three.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: TweenMax.js, RectAreaLightUniformsLib.js
Я хотел посмотреть, смогу ли я сделать мини-игру о pac-man с небольшим поворотом, но каким-то образом закончил создание этого кубического лабиринта с искрящимися огнями и цветами. Затем я понимаю, что это можно использовать как игровое меню.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: EffectComposer.js, UnrealBloomPass.js, perlin.js, THREE.MeshLine.js, TweenMax.js
Кристальные земли — еще один эксперимент с библиотекой three.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js
Экстремальные фрактальные искажения шума. Вроде как коралловые цветы на поверхности темного океана. Двигайте мышью, чтобы увеличить скорость симуляции. Я был бы признателен, если бы вы в конечном итоге использовали этот код в любой производственной ситуации, чтобы вы цитировали меня в своем коде и сообщали мне, для чего вы его использовали. Мне нравится видеть, что люди действительно получают выгоду от того, что я пишу, и я не думаю, что это слишком много, чтобы просить, чтобы я получил цитату из-за моих неприятностей 🙂
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: —
Изометрическая комната — Three.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: jQuery.js
Стабильный шум скручиваемости с помощью трех джойстиков.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: GPUComputationRenderer.js, OrbitControls.js
Маленькие низкополигональные овцы, сделанные с three.js . Нажмите, чтобы прыгать и чувствовать себя сонным:)
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js
О коде
Анимация «Плохой / Уолтер Уайт» с three.js . Удерживайте нажатой кнопку, чтобы преобразовать.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: —
Это моя первая правильная попытка создать что-то в THREE.js ! Вы, вероятно, обнаружите, что большая часть JS небрежна и неоптимизирована.
Переходы выполняются с использованием максимальной шкалы времени GSAP, а 3D-интерфейс построен с использованием моего плагина deepUI JS.
Честно говоря, я понятия не имею, как я получил до конечного продукта. Концепция начиналась как простой слайдер продуктов в THREE JS и в конечном итоге становилась все более и более сложной по мере развития. Игра, к которой, по всей видимости, принадлежит сцена, полностью вымышленная, и, конечно, ничего из этого не будет использовано в производстве.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: font-awesome.css, OrbitControls.js, jquery.js, TweenMax.js
Перетащите изображение или загрузите изображение, чтобы создать 3d-пиксели.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: dat.gui.js, OrbitControls.js, CustomBounce.js, CustomEase.js, TweenMax.js / p>
Ночная прогулка по снежному ландшафту.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: TweenMax.js
О коде
Еще одна теплая зимняя сцена, которая помогает мне поэкспериментировать с освещением, тенями и трехмерными изображениями в пределах Three.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, TweenMax.js
Три шейдера JS.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: jQuery.js
Шейдерный переход изображения с помощью three.js . Нажмите и перетащите, чтобы управлять анимацией.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: bas.js, OrbitControls-2.js, TweenMax.js
Демонстрация WebGL с использованием ThreeJs . С обратной кинематикой, физикой и множеством кошачьей психологии 🙂 Этот кот — трехмерный римейк главного персонажа "Babel, кота, который будет королем", детского приложения, которое я сделал некоторое время назад.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, cat.js, TweenMax.min.js
Помогите дракону развести огонь, нажмите как можно быстрее, затем отпустите. Исследование дыма и огня с использованием ThreeJS и TweenMax.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, TweenMax.js
Нажмите и перетащите, чтобы повернуть сцену. Сделано с three.js и TweenMax.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: —
Эксперимент WebGL с использованием ThreeJS . Переместите вентилятор и нажмите, чтобы поднять ветер, лев наверняка оценит.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js
Параноидальная птица, окруженная двумя застенчивыми приятелями с бегающим взглядом. Эксперимент WebGL с использованием Three.js и немного TweenMax.js.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: OrbitControls.js, TweenMax.js
Эксперимент WebGL с использованием ThreeJs . Двигайте мышью вправо и влево, сверху и снизу, чтобы изменить скорость и направление.
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Зависимости: —
Сетки и проектирование сайтов (онлайн) Александр Гладких, Сергей Гуровbangbangeducation.ru/course/grids В противовес курсу Свята на Bang Bang есть курс Саши и Серёжи про сетки. Длится он тоже около месяца, стоит даже дороже, но в отличие от «12 уроков по типографике» это скорее просто серия видосов с общей информацией от ребят, пару вебинаров с ответами на присланные…
