Присоединяйся к нам Войти
?
Добро пожаловать на Тэйлдер Добро пожаловать на Тэйлдер
Привет хвостатое королевство и все его обитатели. Моя сегодняшняя история поведает о том, почему Тэйлдер оказался таким какой он есть, откуда что взялось. Обычно дизайнеры умалчивают о том, чем они вдохновлялись или что позаимствовали, поэтому они часто вляпываются в интересные истории с плагиатом или и вовсе в апофеозы с использованием картинок из интернета не по назначению. Но мы ведь все самураи, так что давайте я по-честному все расскажу.

1.jpg

Базовыми цветами Тэйлдера стали: рыжий (#ff6600), белый (#ffffff), черный (#000000) и серый (#eeeeee). Первоначально серый не планировался и я хотел работать только с тремя цветами, использованными в логотипе. Однако у меня возникла непреодолимая сложность: "Каким цветом сделать фон?". Поскольку жизнь меня чему-то да учит, то я решил, что черный и рыжий не годятся для фона из-за своей дерзости и лютой резкости, которыми грешил мой прошлый проект Rock Review (в формах ответа - красный фон и белые буква, за такое меня ругали много раз). А Тэйлдер должен был быть теплым, легким и пушистым как лисичка!

Я пробовал несколько разных вариантов и остановился на светло-сером, он легко воспринимается, а кроме того, это увеличило мои творческие возможности в оформлении. Видите ли, дизайн - это набор правил, которые ты обозначаешь для себя заранее, дальше тебе остается лишь следовать им. Таким образом у меня есть 4 базовых цвета и один дополнительный, их я и придерживаюсь, ничего не добавляя. Тоже касается размера шрифтов и отступов, все они определены и я ничего не изобретаю. Так что дизайн - это практически законотворчество.

Но я начал не с самого начала, прежде чем в моей голове появился примерный дизайн Тэйлдера я просматривал некоторые сайты. Мне нужно было что-то простое, органичное и красивое. И тут я подумал: "У ребят из Apple вроде бы простенький и стильный сайт, надо бы разглядеть его во всех местах".

3.jpg

Долго всматриваясь в этот сайт, бродя по всем его разделам я пришел к выводу, что многое в их оформлении дают фотографии и шрифт, тем не менее, само оформление сделано просто и стильно в легких тонах. Главной фишкой Тэйлдера должна была стать легкость его восприятия и использования, так что я решил минимизировать оформление, добавить пару линий, обозначающих центральный фрейм и выбрать читабельный шрифт.

Чтобы сайт выглядел нескучно размер линий варьируется и они разных нескучных цветов. Слева черная линия - 10px, справа - серая (невидимая из-за фона) 5px, сверху и снизу рыжие - 15x. Поверьте, я пробовал много разных комбинаций, но эта мне показалась самой эстетичной. Тоже касается радиуса границ, я пробовал 50x, а потом 10px, но решил закруглить аж на 100px. И тут я понял, что мой Тэйлдер теперь похож на смартфон, а это навело меня на мысль, что можно двинуться в этом направлении.

4.jpg

Xzibit учил приделывать монитор ко всему, что движется, я переосмыслил его и дею и приделал что-то другое. Первоначально верхние кнопки "Помощь" и "Добавить Тэйл" выглядели иначе. Они были длинными, это позднее я сделал их кружочками, так что кнопки стали похожими на что-то вроде камеры у смартфона. Мне это понравилось, особенно в мобильной версии, где важная эргономичность. Мой внутренний эстет был доволен.

5.jpg

Но все это омрачалось тем фактом, что у Apple классный шрифт, а я выбрать не мог тот, который бы неплохо выглядел и задавал тон. Украсть шрифт у ребят из Apple я не мог, это подсудное дело, поэтому я украл у Twitter. На самом деле нет, но я действительно порылся по соц. сетям и посмотрел на их шрифты и насколько хорошо они смотрелись на телефоне и десктопе. Twitter использовал шрифт Segoe UI - гуманистический гротеск, который любит корпорация Microsoft. Шрифт входит отряд стандартных. Мне он понравился визуально, читался хорошо, выглядел неплохо и в конце концов это не Arial, против которого я ничего не имею, но не ставлю его на своих проектах, так что извиняй друг. Справедливости ради на Тэйлдере Arial выставлен вторым шрифтом после Segoe UI, так что если у вас проблемы с первым, он отбирает ваши деньги на завтраки и вообще подозрительно смотрит на вас, то ему на смену приходит старины Arial и он-то вам покажет весь свой блеск и шарм.

Сайт получался простым, как скрепка - отступы в 40px, 20px и 10px были установлены заранее, а шрифт укладывался в 30px, 18px и 14px. Все просто, оставалось только плыть по течению и справляться с локальными задачами, вроде введения зеленого цвета. В интернете принято, что плюсик - зеленый, так что пришлось пойти на поводу и я его ввел локально для этих нужд.

Чуть ранее, я разрабатывал дизайн хвостатого логотипа, который со временем видоизменялся, у него была буквально покемонья эволюция. На самом деле сперва я хотел сделать что-то милое и пушистое, так что нашел несколько лисят из интернета, в том числе поглядывал на Тайлза (один мой друг подбивает меня до сих пор на то, чтобы сделать двойной хвост лисенку, но ребята из Sega могут и по голове постучать, да против шерсти погладить) из серии игр Sonic и Ника Уайлда из мультфильма "Зверополис". Но вышло что-то очень детское:

2.jpg

И тут я подумал, что надо что-то с этим делать, логотип должен быть простым как и весь сайт, так что я просмотрел несколько лисиных логотипов да так, чтобы как-нибудь не сделать Firefox.

6.jpg

Как результат я сделал свой вариант, он, конечно чертами похож на некоторые другие из перечня, но копировать я не планировал, так что все линии рисовал сам. Скажу так, я не уверен, что кто-то придумывает с нуля, потому что мы мыслим ассоциациями, тем что видели, но можем даже не помнить об этом. Так что все эти истории с плагиатом я воспринимаю с достаточной долей понимания. Иногда ты думаешь, что делаешь то, чего не делал никто до тебя, а потом оказывается, что подобный рисунок уже есть, но ты его не видел, а тебе говорят, что ты украл идею. Мой мозг работал так, я увидел все эти картинки и взял немного ото всех, где-то больше, где-то меньше.

Вы, конечно, можете не согласиться, но это и есть творчество. Ты анализируешь разные потоки информации и создаешь что-то из того, что анализировал, а поскольку комбинаций бывает много, то получается что-то свое. А потом и твое творчество пускается в поток и уже на основе твоего кто-то что-то делает. Это нормально.

7.jpg

В целом оформление Тэйлдера это совокупность других оформлений, не последнюю роль сыграл Хабрахабр, который мне нравится из-за своей скромности дизайна. При этом я хотел пойти дальше и сделать еще проще, убрать выделение жирным в тексте, чтобы форматирование сводилось до того, что ты словно бы пишешь просто большой твит про свое увлечение. Так что никаких Bold на сайте, а тег <strong> и вовсе вне закона! Только простой текст, картинки и видео. Что будет дальше не знаю, главное чтобы кто-то все-таки сделал свой первый шаг. Надеюсь вам было интересно.
1 1 1 1 1 18

Рейтинг:  5 / 5

Звезда активнаЗвезда активнаЗвезда активнаЗвезда активнаЗвезда активна