Вопросы к билетам на гос экзамен по Графическому web-дизайну
Скачать 0.84 Mb.
|
| Вопросы к билетам на ГОС экзамен по Графическому WEB-дизайну 01. Стиль в веб-дизайне. Определение. Характеристика модульной сетки. Типы веб-дизайна: текстовый, динамический, конструктивный, полиграфический, смешанный. Характеристики. Четыре правила профессионального веб-дизайна. Стиль – это система визуальных элементов, призванная обеспечить целостность восприятия веб-страницы или всего сайта. Стиль призван обеспечивать уникальность восприятию веб-сайта. Основные элементы стиля: логотип, модульная сетка, шрифт, цвета, иллюстративный ряд (приемы обработки изображения). Модульная сетка – это тщательно продуманный шаблон с табличной сеткой, в ячейки которой грузится текстовая или графическая информация. Концепция блочного устройства сайта – расположение блоков (конструкция), предназначение каждого блока, размеры каждого блока, технология загрузки информации в блок, технология обновления информации. Информация - логотип, баннеры, система навигации , информационные блоки и графики. Текстовый – почти полное отсутствие изображений. Навигация и декор. элементы выполняются символьными приемами. Важно хорошо знать классические приемы верстки, особенности использования шрифтов. Используется в поисковых системах, электронных каталогах. Полиграфический–страница имитирует печатное издание (буклетные типы). Используется для корпоративных сайтов, сайтов с рекламным уклоном, где необходимо образно-эмоциональное наполнение. Ставка делается на классические дизайнерские приемы –общий дизайн, потом нарезать и собрать. Основное впечатление за счет пиксельной графики. (Интерфейсный) – юзабилити, активно пропагандируемый Якобом Нильсеном. Призван максимально облегчить жизнь пользователя - от загрузки страницы (минимизирование кода и оптимизация изображения) до особо тщательного использования каждого элемента. Досконально продуманная навигация, понятная общая схема сайта (даже если с точки зрения эстетики не всегда всё сделано правильно.) Динамический – flash DHTML javaScript. Хорошо продуманный сценарий, последовательно разворачивающийся перед зрителем. Смешанный тип - комбинация перечисленных выше веб-изайнов. Конструктивный -наличие правильных геометрических форм, наличие двух тонов. 4 правила: 1 – Побольше мелких деталей – концепция размельчения дизайна. (заголовок– 1 размер, подзаголовки меньший кегель, верстка в несколько колонок, градиентная заливка, декор. элементы, пиктограммы, разделительные полосы, рамки ) 2 – Повышенное внимание к мелочам – использованы ли пиктограммы и понятны ли они пользователю, орфография, различие цветов у ссылок, направление теней, разные мониторы. 3 - Гармоничное сочетание цветов – чтобы текст читался хорошо, чтобы общий цветовой фон не вызывал у пользователя раздражения, 4 - Гармоничное сочетание шрифтов – не больше 1 или 2, но разного размера шрифты 02. Стили веб-дизайна. Готическая органика. Стили веб-дизайна. Табличный-пиктографический стиль. Готическая органика. Идея – разложить хаос мира на части. Источники вдохновение – человеческое тело, природные органические текстуры. В качестве строительного материала берут растительные элементы, фигуры людей, органические формы. Использование изображений с неровными краями, анимированные гифы с прозрачностью, вертикальный скроллинг. Готический по двум причинам - подобен готическому собору, многим обязан современному авангардному готическому искусству – интерес к смерти, темному фону. Основатель стиля Аурелия Харви. Основные положения – 1 симметрия – это смерть. 2 закон энтропии - стремление любой упорядоченной системы к хаосу 3 для готической органики очень важны фоновые изображения Главное в стиле – способность создавать красивое художественное полотно. Цель – создать текстуру и картинки, которые не похожи на цифровые. Исследование нового и непонятного. Система навигации запутана, смысл не всегда понятен. Фоновые изображения темные, сложные –с прожилками, обломками, кляксами. Подходит для сайтов, главная цель которых – создание имиджа – раскрутка торговой марки или продукта. (для сайтов туристических компаний, морских круизов, и любых других, где необходимо погрузить пользователя в атмосферу, не подходит для информационных сайтов) Табличный-пиктографический – Идея – уважение к стилю Баухаус, использование географических карт, графиков, схем. Источник вдохновения – архитектурные чертежи, ретро-электронные интерфейсы, Для рекламы машин, мотоциклов, обуви, одежды и всего того, что должно быть спроектировано. Официальный технический чертежный дух. Приемы – 1.расположение геометрических форм под углом, кратным 45 градусам – для придачи вида чертежа, 2. использование абстрактных фрагментов изображения и включение их в оформление 3.сочетание фотографии с табличными схемами Стиль одновременно запутан и минималистичен, особое внимание к мелочам. Лаконичные выразительные элементы на переднем плане и формируют каркас, а сложные детали на заднем плане придают проекту красоту и богатство звучания. 03. Стили веб-дизайна. Стиль бумажных пакетов. Стили веб-дизайна. Низкокачественный грандж. Стиль бумажных пакетов – Карикатурный, игривый, неряшливый дизайн, отсканированные альбомные рисунки, черно-белая палитра, ассиметричные шрифты. Источник вдохновения: комиксы середины столетья, бумажные пакеты Приемы: полутоновые и двухтоновые изображения, ручные шрифты, неровности, нарочитое подчеркивание швов, использование цветов для выделения (если все серое, одна деталь, выделенная цветом, непременно привлечет все внимание), утонченные анимации в качестве фонового изображения или просто для развлечения, иногда намеренно неверное расположение навигационной панели Стиль изобилует – стилизованными стрелками, витиеватыми скобками, ужасными деревянными шрифтами, всевозможными кружевами и филигранью. Основа 0 текстура бумажного пакета. Эстетика – использование диаграммных фигур, смутного фотографического изображения на заднем плане. Приемы – нужен эффект помятости и изношенности, а не фотография старой бумаги. Намеренная неровность и небрежность границ. Границы и текстуры относятся к заднему плану, а цвета, элементы навигации и представляемые объекты размещаются на переднем. Разумное использование цвета – дизайнеры пользуются цветом только для выделения важных элементов. Кочующая панель навигации. Девиз – тот факт, что вам не полагается так делать, ещё не значит что этого вы не можете. Основатели стиля выражают стремление к анархии. Для детских сайтов. Сайт для рекламы модной одежды. Низкокачественный грандж Идея – приблизится к печати настолько, насколько это возможно. Источник вдохновения: аналоговая печать, грязные пятна, кляксы, наложения, пиктограммы старой школы Приемы: имитация линий развертки старых телевизоров, точки и тире, силуэты изображений неправильной формы, парные фоновые гифы с такими же гифами на первом плане, использование для наложения друг на друга. домашние страницы/дизайнерские фирмы Телевизионные полосы, помехи, эффект снега. Сочетание характерной для 60х неточности печати с небрежными, отрицающими сетку композициями . Пятна, неровные шрифты Кисти для пятен – придают странице расплывчатый вид, свойственный оттискам, сделанным на аналоговом печатном прессе. Движение внутри коллажа. Сайты небрежные и смешные, но не случайные. Подходит для развлекательных онлайн журналов – мода, спорт, экстрим. Для рекламы – велосипедов, шин, сноубордов. Использование гранжевого шрифта пишущей машинки. Слегка размазанного, не пропечатанного. 04. Стили веб-дизайна. Стиль HTML-минимализма. Стили веб-дизайна. Стиль чертежей и моделей. Хтмл минималисты использую свое дизайнерское мастерство, чтобы превратить простое из скучного в подчеркнутое. Источники вдохновения – хтмл код, идеи Якоба Нильсона. Технологии – : игры со шрифтом с помощью CSS, упор на цвет для выделения смысла, быстро загружаемые логотипы в виде гифов, html и текст - элементы дизайна Рассматривают веб-страницу к не как статичную журнальную страницу, а как подвижную сущность, которая изменяется, приспосабливается к техническим ограничениям и предпочтениям зрителя. Приемы – цсс контроль – нет флэша, дхтмл, рекомендуется таблица стилей. -комбинации цветов – стиль минималистичен в плане изображений, но использует программно задаваемые цвета. - налувной алфавит - использование гиф изображений _ табличные шрифты - . Минималистический дизайн редко выбвает слабым и скучным. Он аккуратный, удобный, масштабируемы и элегантный. Задача – облегчить, а не усложнить жизнь пользователя. Хороо применяется на сайтах с большим V чистого текста. – онлайновые газеты, научные журналы, учебные пособия, отраслевые издания. Так же подходит для сайтов электронной коммерции, где необходимо разместить большие базы данных о товарах. Для компании, которая хочет сказать, что дело превыше всего. Стиль чертежей и моделей. Сайтам присущи массивные скопления футуристических трехмерных форм, плывущих в полупустом пространстве. Источник вдохновения: Архитектурные кальки Захи Хадид (Zaha Hadid), технические руководства, игрушки роботы-трансформеры, шрих-код, миллиметровка, тексты мелким шрифтом Приемы: ПО 3-хмерного моделирования, мелкие плохо читаемые нео-технологические шрифты, отрицательное смещение, крупные элементы, запутанные элементы навигации домашние страницы/дизайнерские фирмы: DFORM1, Vir2L, chapter3, mr. eel примеры коммерческих сайтов: mtv2 Технические приемы сводятся к 2 элементам – трехмерным объемам и неразборчивому тексту. Обладают агрессивным механистическим духом. Подходит не для всех сайтов. Загадочные элементы навигации. Подходит для рекламных сайтов, где надо, чтобы продукция ассоциировалась с продвинутым интеллектуальным высокотехнологичным будущем. Для рекламы машин или ультросовременной молодежной музыки. Для раскрутки научно-фантастического фильма или романа. 05. Стили веб-дизайна. Суперминиатюрный городской стиль. Стили веб-дизайна. Стиль 1950-ых Привет Китти. Характеризуется наличием крохотных цифровых человечков, зданий, предметов. Так же известен благодаря использованию очень маленьких экранных шрифтов и сильного дробления. Источник вдохновения: игра SimCity, игры для Commodore 64, обертки японских конфет Приемы: тонкие сглаженные шрифты, излишнее дробление и детализация, мелкие пиксельные изображения людей/строений/объектов Необходимо, чтобы каждый объект, появившийся на сайте выглядел достаточно ретро, чтобы естественно восприниматься в видео игре выпущенной до начала 90х. Приемы – крошечные растровые человечки, здания предметы, а так же растровые надписи. Страница должна быть разделена фоновыми разделителями и четкими трехмерными границами. Подходит для сайта содержащего много информации, которую необходимо разместить на небольшом пространстве. Добавит веселья и легкости даже самому серьезному сайту. Стиль "Hello Kitty" 1950-х годов Это смесь забавных японских комиксов, шведских марионеток, анимированных персонажей деревянных мультиков из странных специальных выпусков ив к рождеству и хромировано-металлические автоприцепы 1950х. Источник вдохновения: комиксы для девчонок, рождественские сувениры, атрибуты домов-прицепов 50-ых годов. Приемы: 3-хмерные объекты/текст, скругленные правильные края, яркие цвета на светлом фоне, курсивный шрифт, подростковый юмор Приемы – в архитектуре и композиции нет ничего, чтобы позволило отнести к стилю. Стиль выражается посредством Рафики. Поэтому хорошо смотрится и в печатном виде. Трехмерные круглые человечки – сродни играм чем веб-сайтам. Округлые естественные границы – кружевные завитки, симметричные границы меню. Пастельная палитра – мягкая многоцветная палитра. Размещение прозрачных цветов поверх непрозрачных – добавляет объемности и окрыглости сайту. Шрифты 50х и искусство 50х. –вывески на кинотеатрах или казино Лас Вегаса. Стиль – сплав различных веяний. Может развиваться в разных направлениях. От китча 50х до психоделических мечтаний детей. Общее со стилем чертежей и моделей – использование трехмерной графики. Подходит для сайтов поздравительных открыток, садоводства, сайтах- партфолио фотографов, экспериментальных электронных журналов. 06. Стили веб-дизайна. Плакатный Мондриановский стиль. Стили веб-дизайна. Цифровой панк-роковый стиль. Мондриановский плакатный стиль Стиль использует возможности пустого пространства и сторонится границ. Для разграничения разделов используются четкие одноцветные области. Источник вдохновения: Пит Мондриан, Роберт Лонго. Постеры, выполненные в их технике. Приемы: Нарочито большие элементы меню, вкрапленные в общий дизайн, частое использование отрицательных смещений, все чисто, без суматохи. Все окно броузера рассматривается как единое пространство для дизайна. Стиль принимает эстетику минимализма, но в пышном и роскошном варианте. Выравнивание элементов играет большое значение, так как отсутствует сетка координат на заднем плане. Приемы – целостное оформление окна браузера Полноэкранное решение во флэш, фиксированные размеры, выбор цветовой палитры – один оттенок – разная насыщенность или одинаковая насыщенность но разные оттенки. Цель – превратить окно браузера в единое изобразительное пространство. Используется для коммерческих сайтов, корпоративных сайтов. Стиль простой и элегантный. Подходит для онлайн музеев, архитектурных фирм, каталогов модной одежды. Для сайтов ресторанов, курортов, ночных клубов. Плохо будет выглядеть на сайтах с большим объемом информации и сложной иерархией. Цифровой панк-рок стиль Стиль намерено сбивает с толку, враждебный к пользователю, дезориентирующий и раздражающий или эмоционально тревожный. Источник вдохновения: хаос, необычное поведение машин, программный код, Жорж Серо (George Seraut), дадаизм. Приемы: сильно увеличенные и искаженные джипеги и гифы, случайным образом сгенерированные изображения, постоянное движение, html-код и элементы форм в качестве абстрактных деталей дизайна, сияющие неоновые цвета, режущие слух звуки, навороченный dhtml, намеренно испорченная навигация. Создает ложное ощущение контроля над ситуацией. Манипулирует ими и принуждает в действию, которое они и не собирались делать. Психоделическая версия Приемы – ложная неисправность, отсутствующие или неверно работающие указатели, постоянное движение и шум, нетрадиционная обрезка и увеличение изображения, функция наведения курсора мыши. Посетители – крысы в лаборатории дизайнера. Пример – игровой детский сайт – Алиса в стране чудес, 07. Тип. Прототип. Архетип. Определение. Характеристики. Понятие usability. Характеристика. Позиция Якоба Нильсена. Существуют общие типы дизайна сайтов на уровне концептуальных задач. Корпоративный сайт, информационный, развлекательный, личная страничка... Общий внешний вид, структура сайта должна с первого вгляда определять принадлежность к тому или другому типу. Архетипы Архетип - первоначальный уровень деления сайтов на типы (корпоративный там, информационный...) В чистом виде таких сайтов нет, вернее, существует еще множество делений на типы внутри конкретного архетипа. Корпоративные (в основном это интернет-представительства фирм и корпораций - ну потому так и называется) могут быть компьютерного направления, софтового, промышленного, банковского и даже культурного направления, ибо есть комм. фирмы, строящие свою деятельность в сфере культуры. В общем, бизнес-класс. Второй архетип - чисто информационный. Обычные СМИ, виртуальные СМИ, сайты телеканалов - то есть суть их в подаче новостей, аналитики и рекламной информации. Третий архетип - развлекательные сайты. Опять же это анекдоты, полезные советы, ну и сайты с разного рода картинками. Четвертый архетип, по сути таковым не являющий из-за своего предельного многообразия - личные сайты и личные странички. На уровне типов практически почти все сайты имеют достаточно смешанную структуру, то есть один архетип с элементами другого или нескольких. Прототип - это тот более менее конкретный образец, ставший основой для концепции сайта. Использовать прототип - это не значит клонировать чей-то сайт. Ибо прототипы бывают структурные, концептуальные, дизайнерские (это когда используются определенные приемы, уже кем-то ранее разработанные, типсы, например)... Обычно прототипом бывает либо предыдущая версия, либо развитая версия чьей либо независимой разработки . Но грань между использованием прототипа и плагиатом чьего-либо решения может оказаться настолько тонкой, что можно даже неумышленно свалиться в клон. Пример прототипа художественного решения - цветастенькие буквы на черном фоне, используемый на десятках тысяч сайтов. Кто кого тут плагиатит - никому не ведомо (и неинтересно). Бывает так, что талантливая разработка конкретного дизайнера со временем становится прототипом для многих сайтов с утерей информации на первоначальный прототип (становится массово применяемым приемом). Рождается определенное направление в стиле... Usability - активно пропагандируемый Якобом Нильсеном. Призван максимально облегчить жизнь пользователя - от загрузки страницы (минимизирование кода и оптимизация изображения) до особо тщательного использования каждого элемента. Досконально продуманная навигация, понятная общая схема сайта (даже если с точки зрения эстетики не всегда всё сделано правильно.) Термин «usability» можно буквально перевести как «удобство использования». Но «удобство использования» – лишь один из аспектов понятия “usability”, употребляемого в современной "компьютерной" терминологии. Говоря профессиональным языком, пользовательский интерфейс будущего сайта должен быть дружелюбным и интуитивно понятным. Гуру юзабилити в WEB-дизайне Якоб Нильсон предлагает оценивать интерфейс с точки зрения юзабилити, применяя пять количественных составляющих: • Обучаемость: насколько легко пользователи могут выполнить задачи, впервые встретившись с незнакомым им интерфейсом? • Эффективность: после того, как пользователи ознакомятся с дизайном, как быстро они могут выполнить те же задачи? • Запоминаемость: после того, как пользователь снова вернется к интерфейсу через какое-то время, насколько легко ему будет восстановить свои навыки работы с данным интерфейсом? • Ошибки: сколько ошибок делает пользователь и насколько они серьёзны. Насколько легко пользователь может исправить эти ошибки? • Удовлетворенность: насколько пользователю приятно пользоваться данным интерфейсом? Некоторые советы Якоба Нильсона по созданию эффективного сайта: 1. На каждой странице сайта должно быть меню. 2. С любой страницы сайта должен быть предусмотрен очевидный переход на главную страницу. 3. Пользователь не должен искать адрес, телефон вашей компании. Кнопка «купить» или «оплатить» должна быть всегда под рукой. 4. Место логотипа компании — левый верхний угол каждой страницы. 5. Сайт должен иметь строку навигации, показывающую текущее положение в иерархической структуре, с возможностью перехода на любой верхний подуровень, например: «публикации :: статьи :: о юзабилити» 6. Сайт должен отображаться одинаково в любой версии всех популярных браузеров. 7. Дизайн сайта должен не зависеть от разрешения экрана, на котором сайт просматривают. 8. Тексты должны быть короткими, лаконичными, разбитыми на маленькие абзацы, с выделением шрифтом ключевых слов и понятий 08. Цветовые модели: RGB, HSB, HSL, CMYK. Виды. Характеристики. Понятие безопасной палитры для веб. Система HEX. Цветовой круг. Цветовая модель - это способ математического описания цвета. Можно выделить аддитивные (add - сложить) и субтрактивные (subtract - вычесть) Самая распространенная аддитивная цветовая модель - RGB (red, green, blue), в образовании оттенка участвуют три базовых цвета - красный, зеленый, синий. При сложении этих цветов получается белый. Цветовая модель используется в таких светящихся устройствах, как телевизионные кинескопы и компьютерные мониторы. |
Похожие:
 | Ниже приведен перечень экзаменационных вопросов. Экзамен проводится в устной форме по билетам. Каждый билет содержит 3 вопроса из... | | Целями преподавания дисциплины «Web- графика и web- дизайн» являются: формирование у будущих специалистов общего представления об... |
| Бланки печатаются согласно дизайну и фирменным цветам, предоставленные заказчиком (цвета предоставляются в cmyk и в Panton) | | Настоящее Руководство пользователя локального рабочего места Системы электронного документооборота (лрм сэд) нрд (web-доступ), далее... |
 | Газ-а21R22 Гос. №А246ВХ, Форд-Транзит Гос. №А794КК, Тойота Гос.№ У080ХХ, Тойота Гос. №В035ТК, Форд транзит Гос. № Х363АР, Мазда-6... | | Системы электронного документооборота (лрм сэд) нрд (web-кабинет Депозитария/Клиринговой организации), далее – Руководство, предназначено... |
| В вузе реализуются ооп специалитета по гос и ооп бакалавриата по фгос в приказе Минобрнауки России от 06. 07. 2015 №667 формы сведений... | | Для более быстрой работы web-интерфейса желательно использовать следующие браузеры |
| Дети в возрасте до 12 лет перевозятся по билетам с предоставлением 50% скидки от тарифа для взрослого пассажира (если иное не оговаривается... | | Единой системы аутентификации пользователей внутренних Web-сервисов мтс (Internal Web sso) для ОАО «мтс» (147108) |