Лучшие ресурсы для веб мастера и дизайнера
Этот PSD шаблон белой версии iPhone 5 в 3D не просто великолепен, он восхитителен. Почему?
Потому, что скачав этот файл вы получите не только новый набор фоновых текстур высокого качества, которые также можно использовать и для черного iPhone, вы получите модель, полностью выполненную в векторе, следовательно, ее можно увеличивать или уменьшать без потери качества, что, особенно, оценят иллюстраторы.
Качаем...
Timeline — это jQuery плагин, который специализируется на показе хронологических последовательностей событий.
Вы можете добавлять в шкалу времени любые виды медиа-контента, включая твиты, видео, карты, и связывать их с определёнными датами. С некоторыми дизайнерскими доработками, это станет идеальным решением для оформления портфолио, в котором вы сможете показать свои работы и интересы.
В нашем новом уроке мы создадим элегантное вертикальное, многоцветное, кроссбраузерное CSS3 меню с трёхмерной анимацией (с помощью свойств CSS3: transition, perspective и transform) и переключатель цветов. Наше меню будет основано на тегах UL-LI.
Вы в курсе, что с помощью CSS3 можно переворачивать элементы в 3D-пространстве? Думаю, что да, ведь такая возможность доступна уже целых два года!
Сначала эту технологию поддерживали браузеры только на основе движка Webkit – Safari и Chrome, но сейчас и Firefox присоединился к ним. Это значит, что больше половины пользователей (кроме тех, кто использует браузер IE) может увидеть современные анимационные эффекты на основе CSS.
В этом уроке мы увидим, как можно использовать эти трансформации для создания интересных эффектов. В качестве примера мы будем переворачивать Apple-подобную форму авторизации.
C 3D трансформацией мы можем сделать простые элементы интересными, просто показав их в трехмерном пространстве.
Вместе с CSS transitions, эти элементы могут быть помещены в 3D пространство для создания реалистичного эффекта. Например, посмотрите на экспериментальную 3D галерею, выполненную с помощью CSS и jQuery.
В наше время во всех современных браузерах есть поддержка 3D позиционирования html элементов. При этом используется специфическое свойство CSS, определенное для каждого браузера. На пример, для Firefox это свойство начинается с -moz, для Оперы -o, для webkit браузеров (Chrome, Safari) -webkit.
Именно поэтому в этом посте были собраны примеры 3D, выполненные с помощью CSS. Впрочем некоторые из примеров все-таки используют Javascript.
Автомобили в 3D помогают нам увидеть то, как будут выглядеть автомобили до их производства. Хотя, самими первыми шагами в создании концепт-каров являются эскизы и наброски, но именно 3D позволяет увидеть концепты, именно «в живую».
Конечно же 3D автомобили очень популярны среди дизайнеров и любителей, которые просто наслаждаются визуализацией новых авто. Кроме того, их отрисовка в реалистичном 3D-виде является очень ценным навыком для 3D-художников.
Поэтому мы особенно рады представить вам эту коллекцию из 30 концепт-каров. В ней вы найдете изображения новых автомобилей и уже выпущенных в производство.
Представляем вам новую игру jPong — 3D ремейк старого доброго пин-понга. Игра выполенена полностью на JavaScript.
При создании игры использовался фреймворк jQuery с плагином collision detection (обнаружение коллизий), плагин line drawing (рисование линий) и немного собственных скриптов.
Вы можете посмотреть исходные коды (комментарии добавлены) и узнать, как все это работает.
Но сейчас, просто запустите игру и наслаждайтесь...
Если вы еще не видели тайнственный и клевый сайт Silverback, то вам стоит его посетить.
Почему? Попробуйте поменять размер окна браузера и вы увидите крутой параллакс эффект двигающихся лоз. Дизайн сайта создавал Пауль Аннет, он же и написал статью, как создавать параллакс эффект в дизайне.
Попробуем создать нечто похоже, используя идею Пауля...
727