[html]<!DOCTYPE html>
<html>
<head>
<meta charset="windows-1251">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://forumstatic.ru/files/0018/1e/e2/75005.css?v=48">
<title>Вёрстка от бродяги</title>
<style>#portfolio .tab-content .inner {width: auto; height: auto;}
#portfolio .tab-content .wip {overflow: hidden !important;}
#portfolio .process .scrollable {width: auto;}</style>
</head>
<body>
<div id="portfolio">
<div class="tabs">
<div class="tab">
<input type="radio" id="tab1" name="tab-group" checked>
<label for="tab1" class="tab-title" title="Обо мне"><span>Обо мне</span></label>
<section class="tab-content">
<div class="inner aboutme">
<h3>Кто я?</h3>
<p>Всем привет! Я Alex Kolmar или просто бродяга (каюсь, тут зарегался под другим ником, но не суть). Админить форумы начал почти сразу после своего прихода на ролевые, т.е. с 2011 года. Всё это время я периодически экспериментировал с кодами и графикой, сделал несколько дизайнов для форумов, поставил на коды несколько чужих макетов, придумывал и модернизировал разные фишки для сайтов.</p>
<h3>Что я умею</h3>
<p>Сразу оговорюсь, что хоть я и хорошо знаком с фотошопом, но считаю себя в первую очередь верстальщиком, а уж потом дизайнером. Пока доводилось работать в основном с форумными ролевыми на платформе mybb/rusff, могу попробовать взяться и за что-то другое, но заранее ничего не обещаю.</p>
<ul>
<li>
<span>Поставлю макет вашего дизайна на код</span>
<p>Умею работать с макетами разной сложности, к вёрстке каждого подхожу индивидуально. Макеты обычно режу самостоятельно.</p>
</li>
<li>
<span>Мобильные/адаптивные версии форумов/сайтов</span>
<p>Даже если у вас уже есть установленный дизайн, я могу сделать его версию для мобильного устройства.</p>
</li>
<li>
<span>html-оформление тем, страниц</span>
<p>Умею верстать страницы с нуля с тем или иным наполнением. Могу взяться за дизайн или вёрстку лендинга.</p>
</li>
<li>
<span>Интерактивные карты</span>
<p>Делаю интерактивные карты, иными словами, карты с кликабельными областями, при клике на которые открываются описания с картинками, ссылками и прочим контентом. Если предполагается добавление новых областей на карту, могу написать инструкцию по работе с ней.</p>
</li>
<li>
<span>Адаптация дополнений для форума и несложных скриптов</span>
<p>Подгоню по цвету/стилю/размеру различные дополнения для форума (слайдеры, скрипты маски, окна дополнительной информации и т.п.). Могу устанавливать несложные скрипты, найденные на просторах интернета (простые фильтры, разные праздничные украшения, часы, календари и прочие "фишки").</p>
</li>
<li>
<span>Создание полных дизайнов под ключ</span>
<p>Как я уже писал выше, меня больше интересует вёрстка, однако разработать полноценный дизайн я тоже могу. Не пробовал делать глянцевые дизайны и вряд ли возьмусь, также не возьмусь за аниме, Корею (специфические жанры, я в них плохо смыслю, извиняйте) и фэнтези (ну не прёт на красивые рамки, замки и драконов, я пытался, честно Т_Т). Больше люблю фантастику, а также могу попробовать что-то в восточном стиле (в духе Принца Персии, Великолепного Века и т.п.). Если вы абсолютно точно знаете, чего хотите, и у вас достаточно референсов, чтобы визуализировать задумку — я могу взяться за создание полного дизайна :з</p>
</li>
<li>
<span>Обучу вёрстке</span>
<p>Я не обучался вёрстке профессионально, а искал информацию в интернете, спрашивал совета у более опытных и совершенствовался на практике. Это долгий процесс, и если вы не желаете проходить подобный путь, то я готов поделиться с вами полученными знаниями :з В первую очередь это касается установки макета на форумы rusff/mybb — его структура и особенности, как подготовить макет дизайна, что возможно, а что невозможно поставить на код, как создавать html-темы, какими инструментами пользоваться, чтобы облегчить себе жизнь и т.д.</p>
</li>
</ul>
<h3>Контакты</h3>
<div class="contacts">
<p class="soc discord" title="discord" target="_blank">AlexKolmar#7262</p>
<a class="soc tg" href="https://t.me/AlexKolmar" title="telegram" target="_blank">@AlexKolmar</a>
<a class="soc vk" href="https://vk.com/byalexkolmar" title="вконтакте" target="_blank">группа вк</a>
<a class="soc ig" href="https://www.instagram.com/alex.kolmar/" title="instagram" target="_blank">instagram</a>
</div>
</div>
</section>
</div>
<div class="tab">
<input type="radio" id="tab2" name="tab-group">
<label for="tab2" class="tab-title" title="О работе и сроках"><span>О работе и сроках</span></label>
<section class="tab-content">
<div class="inner wip">
<p>Чтобы подробнее ознакомиться с условиями работы, нажмите на интересующий блок.</p>
<a class="service" href="#designlayout">
<img src="https://i.imgur.com/76XlIM0.png">
<p>Вёрстка вашего макета</p>
</a>
<a class="service" href="#adaptive">
<img src="https://i.imgur.com/89mnCHY.png">
<p>Адаптивная / мобильная версия сайта</p>
</a>
<a class="service" href="#pages">
<img src="https://i.imgur.com/SjtXaHw.png">
<p>html-оформление тем и страниц</p>
</a>
<a class="service" href="#maps">
<img src="https://i.imgur.com/0IsW23R.png">
<p>Интерактивные карты</p>
</a>
<a class="service" href="#scripts">
<img src="https://i.imgur.com/ijoGguz.png">
<p>Адаптация скриптов и плагинов</p>
</a>
<a class="service" href="#fulldes">
<img src="https://i.imgur.com/tN1FHFu.png">
<p>Создание дизайна под ключ</p>
</a>
<a class="service" href="#study">
<img src="https://i.imgur.com/mKQDBDX.png">
<p>Обучение вёрстке</p>
</a>
<a class="service" href="#rules">
<img src="https://i.imgur.com/7aWib45.png">
<p>Правила и полезная информация</p>
</a>
</div>
<div id="designlayout" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Вёрстка вашего макета</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 1200 рублей;<br>
<b>Время работы:</b> 1-14 дней.
</div>
<p>Процесс довольно простой: вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то прошу вас показать макет и оформить ТЗ. Если мы приходим к согласию, то согласовываем полную стоимость, и вы вносите предоплату в размере 50% от стоимости работы, после чего я начинаю вёрстку на своём тестовике. В зависимости от сложности макета, занятости и срочности вёрстка занимает у меня от суток до недели в среднем. По готовности вёрстки я информирую вас. После второй половины оплаты я иду ставить вам дизайн на чистовик, либо просто отдаю на руки коды. Если вы оплачиваете всю работу заранее, то я могу верстать макет сразу на вашем форуме или тестовике. После полной установки дизайна я оказываю посильную техподдержку в течение 1 месяца по небольшим вопросам. Серьёзные изменения в кодах, установка сложных дополнений, замена основных графических элементов дизайна — за отдельную плату.</p>
<p>Как я писал ранее — работаю с макетами разной сложности. Был опыт вёрстки макета, созданного в Figma, таким образом, вам необязательно делать макет именно в Фотошопе. Мне не важно, новый у вас форум или уже видавший виды со множеством скриптов, настроек и html-тем, однако такая вёрстка обойдётся дороже ввиду учёта всех нюансов и исправления возможных багов.</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Ссылка на файл макета: </li>
<li>Основной цвет ссылок: </li>
<li>Цвет ссылок при наведении курсора: </li>
<li>Эффекты ссылок: </li>
<li>Цвета текста и фона выделенного текста (selection): </li>
<li>Цвета бегунка и дорожки полосы прокрутки: </li>
<li>Наличие html-тем (да/нет), их количество<sup>[1]</sup>: </li>
<li>Эффекты при наведении на ссылки/картинки в шапке: </li>
<li>Список необходимых скриптов: </li>
<li>Нужна мобильная/адаптивная версия? (да/нет)<sup>[2]</sup>: </li>
<li>Прочие пожелания: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] При ответе "Да" желательно будет заполнить ТЗ на оформление html-тем, которое находится в блоке "html-оформление тем и страниц".</p>
<p>[2] При ответе "Да" желательно будет заполнить ТЗ на мобильную/адаптивную версию, которое находится в блоке "Адаптивная/мобильная версия сайта".</p>
</div>
</div>
<div id="adaptive" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Адаптивная/мобильная версия сайта</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 600 рублей;<br>
<b>Время работы:</b> 5-14 дней.
</div>
<p>Даже если у вас на форуме стоит готовый дизайн, свёрстанный другим мастером, я могу сделать мобильную версию вашего форума на основе имеющихся элементов дизайна. Т.е. это будет не упрощённый мобильный дизайн на основе одного из списка стандартных mybb/rusff, а полноценная мобильная версия с сохранением атмосферы вашего дизайна и его цветовой гаммы. Разумеется, всё это будет возможно при условии, если ваш дизайнер не поставил жесточайшие ограничения на возможность изменения дизайна (как бы то ни было, на всякий случай постарайтесь узнать, что он думает по этому поводу).</p>
<p>Как это будет: вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то вы присылаете мне ТЗ, я изучаю ваш существующий дизайн, оцениваю сроки и сложность предстоящей работы. Далее мы обсуждаем детали, и если приходим к соглашению, я берусь делать мобильную версию. Верстать буду на своём, либо вашем тестовике, предварительно перенеся ВСЁ оформление вашего форума (дизайн, скрипты, настройки и т.п.). Черновик/тестовик обязателен, дабы не нарушить работу вашего форума. Исключение — если ваш форум ещё не открыт для игры. По ходу работы раз в какой-то отрезок времени я буду показывать вам промежуточные результаты. Я сообщу вам, когда будет готов окончательный результат. После этого вы оплачиваете работу (или нет, если была предоплата) и я иду ставить мобильный дизайн на ваш основной форум.</p>
<p>Как и в случае с основной вёрсткой, я обеспечиваю техподдержку на всё время жизни мобильного дизайна, могу поправить какие-то мелкие баги (если только они были, действительно, связаны с мобильным дизайном).</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Мобильная или адаптивная версия<sup>[1]</sup>: </li>
<li>Вид основных меню (гамбургер/иконки/иное)<sup>[2]</sup>: </li>
<li>Какие поля профиля можно скрыть: </li>
<li>Прочие пожелания: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] Мобильная версия предполагает только один вариант отображения помимо основного — тот, который будет отображаться на мобильных устройствах в портретной ориентации (в высоту, как вы обычно держите телефон) — обычно это разрешение экрана до 540 пикселей. Адаптивная версия предполагает несколько вариантов отображения — допустим, для мобильных, для планшетов, для мониторов с очень большим разрешением и т.п., а также "резиновость" — плавное растягивание в зависимости от ширины окна (возможность такой реализации нужно оценивать индивидуально).</p>
<p>[2] Вид меню на мобильных устройствах для удобства обычно преобразовывают либо в т.н. "гамбургер" — иконку из 3-4 горизонтальных полосок, при нажатии на которую открывается список пунктов меню, либо просто в несколько иконок вместо текстовых ссылок.</p>
</div>
</div>
<div id="pages" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>html-оформление тем и страниц</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 300 рублей;<br>
<b>Время работы:</b> 1-7 дней.
</div>
<p>Если вам нужно оформить какую-либо тему в html, будь то список внешностей, шаблон анкеты, шапка гостевой книги, личная страница персонажа и прочее в этом роде, то я могу это сделать. Это может быть как чистый html, так и с интерактивными элементами (всплывающие окна, фильтрация по какому-либо признаку и т.п.). Во втором случае может потребоваться поиск или адаптация необходимых скриптов.</p>
<p>Если вам нужно сверстать целую страницу или несколько таких с нуля, я также могу это сделать при наличии у вас макета и хостинга, где впоследствии будет находиться результат (для этой цели сгодятся и форумные файлы).</p>
<p>Вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то прошу вас показать мне макет и заполнить ТЗ. Если мы приходим к соглашению, то я берусь за работу. Скорее всего, буду верстать сперва у себя на компьютере в программе для написания кода, поскольку верстать сразу на том или ином сайте неудобно. Когда работа готова, я сообщаю вам и после оплаты (если не было предоплаты) иду ставить оформление уже у вас.</p>
<p>После установки я оказываю посильную техподдержку в случае, если что-то съедет не туда, поломается и т.п.</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Страница/тема в html<sup>[1]</sup>: </li>
<li>Наличие интерактивных элементов, скриптов, плагинов<sup>[2]</sup>: </li>
<li>Цвет и эффект ссылок при наведении курсора: </li>
<li>Цвета текста и фона выделенного текста (selection): </li>
<li>Цвета бегунка и дорожки полосы прокрутки: </li>
<li>Нужна мобильная/адаптивная версия? (да/нет): </li>
<li>Прочие пожелания: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] Отвечаете, что именно нужно сверстать и прилагаете файл макета будущей темы/страницы.</p>
<p>[2] Предполагаются ли какие-либо всплывающие окна, переключение вкладок, слайдеры, ротаторы и т.п.</p>
<p></p>
</div>
</div>
<div id="maps" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Интерактивные карты</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 500 рублей;<br>
<b>Время работы:</b> от 2 дней.
</div>
<p>Если мир вашей ролевой предполагает наличие интерактивной карты мира (или необязательно мира, это может быть что угодно с кликабельными областями), я с удовольствием помогу оживить данную задумку. Скажу сразу — я не занимаюсь отрисовкой самих карт, поэтому как и в случае с вёрсткой макета дизайна мне понадобится ваш макет карты.</p>
<p>Вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то прошу вас показать мне макет и заполнить ТЗ. Если мы приходим к соглашению, то я берусь за работу. Скорее всего, буду верстать сперва у себя на компьютере в программе для написания кода, поскольку верстать сразу на том или ином сайте неудобно. Когда работа готова, я сообщаю вам и после оплаты (если не было предоплаты) иду ставить оформление уже у вас.</p>
<p>Если ваша интерактивная карта предполагает добавление новых отметок, областей, описаний — укажите это, пожалуйста, в ТЗ в соответствующем пункте. В этом случае я напишу вам небольшое руководство о том, как самостоятельно добавлять новые отметки на карту.</p>
<p>После установки я оказываю посильную техподдержку в случае, если что-то съедет не туда, поломается и т.п.</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Файл с макетом карты: </li>
<li>Дополнительные слои с разметками<sup>[1]</sup>: </li>
<li>Цвет и эффект ссылок при наведении курсора: </li>
<li>Цвета текста и фона выделенного текста (selection): </li>
<li>Цвета бегунка и дорожки полосы прокрутки: </li>
<li>Будет ли информация на карте обновляться: </li>
<li>Прочие пожелания: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] Если для вашей карты требуется включаемая/отключаемая разметка (дополнительные символы, цветовыделение — что угодно), то подробно описываете пожелания в этом пункте.</p>
</div>
</div>
<div id="scripts" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Адаптация скриптов и плагинов</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 100 рублей;<br>
<b>Время работы:</b> варьируется.
</div>
<p>В сети и на форумах технической поддержки выложено огромное количество различных дополнений и скриптов. Некоторые из них достаточно сложные в установке и требуют подгонки под дизайн, некоторые предназначены не конкретно для форумов на платформе mybb/rusff, но их можно адаптировать под нужды форума. Скажу сразу: сам я скриптов не пишу, но в целом понимаю синтаксис javascript и jQuery. Если не найдётся скрипта, подходящего под задачу, либо потребуется его серьёзная доработка, вам придётся обратиться к программисту.</p>
<p>Вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то прошу вас заполнить ТЗ. Если мы приходим к соглашению, то я берусь за работу. Когда работа готова, я сообщаю вам и после оплаты иду ставить/настраивать дополнение у вас.</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Краткое описание/название/ссылка на скрипт или дополнение: </li>
<li>Назначение<sup>[1]</sup>: </li>
<li>Пожелания к настройке: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] Где и для чего планируется использовать дополнение, дабы определиться, как его настраивать. Необязательно к заполнению для скриптов для mybb/rusff.</p>
</div>
</div>
<div id="fulldes" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Создание дизайна под ключ</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> от 2500 рублей;<br>
<b>Время работы:</b> от 2х недель.
</div>
<p>К сожалению, опыт создания полных дизайнов у меня небольшой, к тому же я предпочитаю работать с ограниченным числом жанров, поэтому не могу заранее обещать, что возьмусь делать полный дизайн. Во многом это будет зависеть от наличия свободного времени (или времени, выделенного на работу), вдохновения и того, насколько подробно вы опишете ваши пожелания к дизайну.</p>
<span>Жанры, с которыми я хотел бы поработать:</span>
<ul>
<li>Фантастика;</li>
<li>Восточный антураж;</li>
<li>Неглянцевый реал;</li>
<li>Что-то универсальное, кроссовер.</li>
</ul>
<span>Не смогу/нет желания:</span>
<ul>
<li>Фэнтези;</li>
<li>Глянцевый реал;</li>
<li>Аниме;</li>
<li>Корея.</li>
</ul>
<p>Всё остальное, что не перечислено, обсуждается индивидуально.</p>
<p>Вы связываетесь со мной любым удобным способом и излагаете суть вопроса. Если я не занят, то прошу вас оформить ТЗ. Если мы приходим к согласию, то я в скором времени начинаю работу. В зависимости от сложности задачи, вдохновения и занятости процесс создания дизайна может занять до нескольких недель. Предоплату за разработку макета я НЕ беру вплоть до его готовности. По ходу работы раз в какой-то отрезок времени я буду показывать вам промежуточные результаты для их утверждения или внесения правок. Как только будет готов результат, вы оплачиваете работу (целиком с последующей вёрсткой или только макет). После этого я начинаю вёрстку дизайна на тестовике. Она может занять в районе недели, если не предполагает большого количества html-тем и мобильной/адаптивной версии. После завершения вёрстки вы оплачиваете оставшуюся сумму (если не сделали этого ранее или потребовались дополнительные манипуляции в процессе вёрстки) и я переношу всё оформление на чистовик.</p>
<p>После полной установки дизайна я оказываю посильную техподдержку всё время, пока он стоит на форуме — поправляю мелкие баги, то, что не удалось сразу отловить, и т.п.. Серьёзные изменения в кодах и установка сложных дополнений — за отдельную плату.</p>
<span>Шаблон ТЗ:</span>
<ul>
<li>Фандом/жанр/тематика ролевой: </li>
<li>Предпочтительные палитры цветов<sup>[1]</sup>: </li>
<li>Ссылки на референсы/исходники/дизайны, которые нравятся: </li>
<li>Наличие html-тем (да/нет), их количество<sup>[2]</sup>: </li>
<li>Список необходимых скриптов: </li>
<li>Нужна мобильная/адаптивная версия? (да/нет)<sup>[3]</sup>: </li>
<li>Прочие пожелания: </li>
<li>В какую сумму рассчитываете уложиться: </li>
</ul>
<span>Пояснение</span>
<p>[1] Можете выложить ссылки на палитры с таких сайтов, как <a href="https://color.romanuke.com" target="_blank">IN COLOR BALANCE</a> и т.п., самостоятельно составить палитру на основе понравившейся картинки через <a href="https://www.imgonline.com.ua/get-dominant-colors.php">этот сервис</a> или просто перечислить нужные цвета в hex.</p>
<p>[2] При ответе "Да" желательно будет заполнить ТЗ на оформление html-тем, которое находится в блоке "html-оформление тем и страниц".</p>
<p>[3] При ответе "Да" желательно будет заполнить ТЗ на мобильную/адаптивную версию, которое находится в блоке "Адаптивная/мобильная версия сайта".</p>
</div>
</div>
<div id="study" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Обучение вёрстке</h3>
<div class="scrollable">
<div class="timecost">
<b>Стоимость:</b> 500 рублей/час;<br>
<b>Время работы:</b> 1-2 часа на урок.
</div>
<p>Как я уже говорил, я не обучался вёрстке профессионально и также не являюсь профессиональным преподавателем. Прежде, чем начать обучение, я спрошу у вас, что вы уже умеете и чему хотели бы обучиться, и мы составим примерный план занятий.</p>
<p>Уроки будут в формате трансляций в дискорде или подобной ему программе с возможностью демонстрации экрана и общения. Желательно, чтобы сама программа для видеотрансляций и оборудование было правильно настроено, чтобы мы не потеряли слишком много времени в случае технических неполадок.</p>
<p>Если вы не можете или не хотите обучаться в таком формате, я могу обучать в формате переписки или записывать обучающие видео, однако на это потребуется больше времени и, скорее всего, стоимость обучения изменится в большую или меньшую сторону в зависимости от конкретной задачи.</p>
<p>Также в обучение будут входить домашние задания для самостоятельной работы с последующим разбором на уроке.</p>
<span>Список возможных уроков:</span>
<ul>
<li>Разбор инструментария, необходимого для вёрстки: программы, средства в браузере, справочники, полезные сервисы.</li>
<li>Начало работы с дизайном форума mybb/rusff, особенности разметки и стиля.</li>
<li>Разбор вашего PSD-макета дизайна: оптимизация, что можно, что нельзя реализовать, особенности его предстоящей вёрстки, доработка деталей, рекомендации по нарезке.</li>
<li>Вёрстка вашего макета (потребуется несколько уроков, минимум 3).</li>
<li>Вёрстка html-тем.</li>
<li>Вёрстка страниц с нуля.</li>
<li>Оптимизация, разбор ошибок в вёрстке дизайна (уже поставленного на тот или иной форум — если, допустим, вы ставили самостоятельно или собираете поставить по чьему-то примеру).</li>
<li>Создание и вёрстка мобильного/адаптивного дизайна (от 3х уроков).</li>
</ul>
</div>
</div>
<div id="rules" class="process">
<a href="#" class="close" onclick="return false;" title="закрыть">Ч</a>
<h3>Правила и полезная информация</h3>
<div class="scrollable">
<ol>
<li>Я предпочитаю общение в вежливой и дружелюбной манере. Грубость, претенциозный тон и прочее в этом духе могут отбить у меня желание вести дальнейший диалог и тем более выполнять заказ.</li>
<li>Я не ставлю копирайтов на видимых местах и вообще ставлю их не всегда.</li>
<li>Вы вправе поступать с результатами моей вёрстки вашего макета как вам угодно, за исключением перепродажи и передачи третьим лицам, если это не было оговорено со мной.</li>
<li>Вы вправе поступать с созданным мною для вас дизайном как вам угодно, за исключением перепродажи, передачи третьим лицам и создания производных дизайнов, если это не было оговорено со мной.</li>
<li>Полное или частичное копирование кода интерактивных карт для создания производных на их основе, особенно в коммерческих целях, запрещено, если мы не оговаривали иные условия.</li>
<li>Мне сложно сказать, дорого я беру за свои услуги или, наоборот, дёшево, но я оцениваю свои трудозатраты в указанных рамках.</li>
<li>Основной способ оплаты — перевод на карту Сбера (для жителй России и владельцев карт российских банков). Для владельцев карт не российских и не украинских банков — перевод на карту СтатусБанка. Сумма оплаты в белорусских рублях из расчёта 1BYN = 25RUB. Комиссия за ваш счёт.</li>
<li>При надобности я могу взяться за срочный заказ и постараться сверстать в течение 1-2 суток. Разумеется, за срочность цена увеличивается. Речь только о вёрстке, сделать срочно целый дизайн я не смогу в любом случае.</li>
<li>Вы можете нарезать свой макет самостоятельно, однако PSD всё равно лучше иметь под рукой на случай, если придётся перерезать какой-то элемент. У меня свои методы вёрстки и для них может не подойти вырезанный тем или иным способом графический элемент.</li>
<li>Если вы по каким-то причинам решите отменить ваш заказ — всё решаемо. Если вы не делали предоплату и я не успел начать работу, то не вижу проблем. Поэтому отказываться желательно на начальном этапе. Просто прежде, чем делать заказ, подумайте — вы точно этого хотите?) Если не уверены, то, по крайней мере, не делайте предоплату заказа.</li>
<li>Постоянным клиентам возможны скидки) Также возможны скидки и новым клиентам, но размер и условия лучше обсуждать индивидуально.</li>
</ol>
</div>
</div>
</section>
</div>
<div class="tab">
<input type="radio" id="tab3" name="tab-group">
<label for="tab3" class="tab-title" title="Портфолио"><span>Портфолио и всякие вкусности</span></label>
<section class="tab-content">
<div class="inner works">
<details>
<summary><h3>Дизайны</h3></summary>
<span>Лето 2020</span>
<div class="designs type_a">
<div class="image">
<a href="https://i.imgur.com/fj2JIob.png" title="посмотреть в полном размере" target="_blank">
<img src="https://i.imgur.com/fj2JIob.png">
</a>
</div>
<div class="opis">Дизайн для Pinot Grigio. Мой первый полный дизайн за 8 лет (с конца 2011 года). Помимо самого дизайна подогнал под новый стиль уже существующие на форуме хтмл-темы.</div>
</div>
<span>Лето 2021</span>
<div class="designs type_b">
<div class="opis">Мой первый адаптивный дизайн для <a href="https://manunkind.rusff.me" target="_blank">собственной ролевой</a>. Многие элементы оформления — не растровые изображения (jpg, png), а либо отрисованы посредством css, либо являются векторной графикой (svg), которую я отрисовывал в adobe illustrator. Помимо самого дизайна есть несколько хтмл-тем — гостевая, новости, список персонажей и мини-профиль с достижениями. Они также адаптивны.
<details>
<summary><a>Видеообзор</a></summary>
<iframe width="560" height="315" src="https://www.youtube.com/embed/aX2Za0u_o2c" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</details>
</div>
<div class="image">
<a href="https://i.imgur.com/zgnVHdC.png" title="посмотреть в полном размере" target="_blank">
<img src="https://i.imgur.com/zgnVHdC.png">
</a>
<a href="https://i.imgur.com/u5uSzrk.png" title="посмотреть в полном размере" target="_blank">
<img src="https://i.imgur.com/u5uSzrk.png">
</a>
<a href="https://i.imgur.com/QImJw68.png" title="посмотреть в полном размере" target="_blank">
<img src="https://i.imgur.com/QImJw68.png">
</a>
</div>
</div>
</details>
<details>
<summary><h3>html и интерактивные карты</h3></summary>
<span>Вкладки с информацией</span>
<div class="designs type_a">
<div class="opis">Информация о персонаже в виде контейнера со вкладками. Присутствует простой фильтр сортировки по участникам и скрипт открытия дополнительных окон с информацией о контактах персонажа.</div>
<div class="image">
<a href="https://alexkolmar.github.io/chrono/chrono.html" title="посмотреть в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/rDxqe7m.png">
</a>
</div>
</div>
<div class="designs type_a">
<div class="image">
<a href="https://alexkolmar.github.io/menu/layout.html" title="посмотреть в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/xBri6Mo.png">
</a>
</div>
<div class="opis">Портфолио в виде контейнера со вкладками. Никаких скриптов и особенностей, только описания при наведении на картинку.</div>
</div>
<span>Карта Таллахасси</span>
<div class="designs type_a">
<div class="opis">Интерактивная карта Таллахасси специально для ролевой <a href="http://breakdown.rusff.me">Breakdown</a>. При наведении на ту или иную область карты она выделяется цветом. Помимо районов, на карте кружками отмечены значимые места — учреждения, некоторые частные дома, места преступлений. При клике открывается описание местности с иллюстрацией и списком лиц, которые там живут или работают. Также в верхнем левом углу карты есть кнопка, при клике на которую открывается описание с условными обозначениями.</div>
<div class="image">
<a href="https://alexkolmar.github.io/tallahassee/tallahassee.html" title="посмотреть в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/sHrpg9N.png">
</a>
</div>
</div>
<span>Карта Галактики</span>
<div class="designs type_a">
<div class="image">
<a href="https://alexkolmar.github.io/sm_galaxy_map/map.html" title="посмотреть в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/SSQvpOd.jpg">
</a>
<a href="https://youtu.be/xYRHpEo2dIQ" title="смотреть видео на YouTube" target="_blank">видеообзор</a>
</div>
<div class="opis">Интерактивная карта галактики для проекта <a>Sailor Moon Galactic Game</a>. Сам дизайн карты не мой, его сделала <a>Ray</a>, мои только вёрстка и техническая реализация. Кружками отмечены значимые для сюжета планеты, отметка в виде цветка — расположение Солнечной Системы. При клике на отметки открываются описания с иллюстрациями. Помимо планет, на карте есть два включаемых слоя — слой с сеткой и слой с названиями галактических рукавов.</div>
</div>
<span>html-оформение тем</span>
<div class="designs type_b">
<div class="opis">
html-формление двух тем с интерактивными элементами для фан-клуба Загадочный дом "Кузнечик". Дизайн тем создала As</a>, я занимался вёрсткой и частично реализацией работы интерактивных элементов.
</div>
<div class="image kyz">
<a href="https://alexkolmar.github.io/projects/domkyznechik/letstalk.html" title="посмотреть демо-версию в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/fT9vugK.jpg">
</a>
<a href="https://alexkolmar.github.io/projects/domkyznechik/secretsanta.html" title="посмотреть демо-версию в полном размере и потыкать" target="_blank">
<img src="https://i.imgur.com/rGtzawn.jpg">
</a>
</div>
</details>
<details>
<summary><h3>Вёрстка чужих макетов</h3></summary>
<p>Поясню: <b>я не автор макетов, расположенных ниже!</b> Я просто ставил их на код, кое-где дорисовывая или доводя до ума разные мелочи. К сожалению, много упомянутых ниже проектов либо закрылось, либо сменило дизайн, поэтому <b>посмотреть вживую может не получиться</b>. Но к некоторым дизайнам есть видеообзоры.</p>
<p>P.S. Уважаемые дизайнеры и администраторы нижеследующих форумов! Если наличие вашего макета, вашего имени или ссылки на форум каким-то образом ущемляет ваши права, уведомите меня пожалуйста, об этом, и я изменю/уберу информацию.</p>
<div class="smallpreview">
<span>Breakdown</span>
<h5>Дизайнер макетов: третий рим</h5>
<p>Вместе с автором макетов мы играли на данной ролевой и в какой-то момент решились на коллаб к празднику. А потом к ещё одному и ещё.</p>
<div class="site">
<span>Halloween 2019</span>
<a href="https://i.imgur.com/fAArpaY.png" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/fAArpaY.png"></a>
</div>
<div class="site">
<span>New Year 2020</span>
<a href="https://i.imgur.com/u7pXKBi.png" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/u7pXKBi.png"></a>
</div>
<div class="site">
<span>2nd Anniversary</span>
<a href="https://i.imgur.com/QSMhlvv.png" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/QSMhlvv.png"></a>
</div>
</div>
<div class="designs type_b">
<div class="opis">
<span>Наруто. Возрождение</span>
<h5>Дизайнер макетов: Schmidt</h5>
<p>У данного проекта есть 2 варианта дизайна — дневной и ночной, а также мобильная версия, поддерживающая оба варианта дизайна.</p>
</div>
<div class="image">
<a href="https://i.imgur.com/EsjdUZW.gif" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/EsjdUZW.gif" width="200"></a>
<a href="https://i.imgur.com/heg8KlU.jpg" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/heg8KlU.jpg"></a>
<a href="https://i.imgur.com/7KBzztr.jpg" title="посмотреть в полном размере" target="_blank"><img src="https://i.imgur.com/7KBzztr.jpg"></a>
</div>
</div>
<div class="designs type_b">
<div class="opis">
<span>Staffage</span>
<h5>Дизайнер: Вещий Дух</h5>
<p>Дизайн и вёрстку форуму делал другой дизайнер, я сделал только мобильную версию на основе существующего дизайна, используя его элементы, элементы официального мобильного стиля, а также близкие по стилю и цветовой гамме.</p>
</div>
<div class="image">
<a href="https://forumupload.ru/uploads/0007/e3/f7/7130/249416.png" title="посмотреть в полном размере" target="_blank">
<img src="https://forumupload.ru/uploads/0007/e3/f7/7130/249416.png">
</a>
<a href="https://forumupload.ru/uploads/0007/e3/f7/7130/266714.png" title="посмотреть в полном размере" target="_blank">
<img src="https://forumupload.ru/uploads/0007/e3/f7/7130/266714.png">
</a>
<a href="https://forumupload.ru/uploads/0007/e3/f7/6822/818102.jpg" title="посмотреть в полном размере" target="_blank">
<img src="https://forumupload.ru/uploads/0007/e3/f7/6822/818102.jpg">
</a>
<a href="https://forumupload.ru/uploads/0007/e3/f7/7130/984059.png" title="посмотреть в полном размере" target="_blank">
<img src="https://forumupload.ru/uploads/0007/e3/f7/7130/984059.png">
</a>
</div>
<div class="smallpreview">
<span>Другие форумы</span>
<div class="site">
<span>1984 RESISTANCE</span>
<h5>дизайнер: <a title="это не точно, но он был админом проекта">Dom_in_out</a></h5>
<a href="https://i.imgur.com/vTGNrK1.jpg" target="_blank"><img src="https://i.imgur.com/vTGNrK1.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Sailor Moon Galactic Game</span>
<h5>дизайнер: Ray</h5>
<a href="https://i.imgur.com/vMWxUdm.jpg" target="_blank"><img src="https://i.imgur.com/vMWxUdm.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Мерцания Секунд</span>
<h5>дизайнер: As</h5>
<a href="https://i.imgur.com/h3ymNg3.jpg" target="_blank"><img src="https://i.imgur.com/h3ymNg3.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span><br>Blind Faith</span>
<h5>дизайнер: .angvar</h5>
<a href="https://i.imgur.com/srVmLmo.png" target="_blank"><img src="https://i.imgur.com/srVmLmo.png" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>CodeVein — Наследие Королевы</span>
<h5>дизайнер: Kiros56488123</h5>
<a href="https://i.imgur.com/hwynQFa.jpg" target="_blank"><img src="https://i.imgur.com/hwynQFa.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span><br>DC: ManUNkind</span>
<h5>дизайнер: achromatic</h5>
<a href="https://i.imgur.com/hkuDkPJ.jpg" target="_blank"><img src="https://i.imgur.com/hkuDkPJ.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>D.Gray-man</span>
<h5>дизайнер: Tyki Mikk</h5>
<a href="https://i.imgur.com/QyQi48y.png" target="_blank"><img src="https://i.imgur.com/QyQi48y.png" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Blueming</span>
<h5>дизайнер: falconsama</h5>
<a href="https://i.imgur.com/vbSrMiZ.jpg" target="_blank"><img src="https://i.imgur.com/vbSrMiZ.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>SailorMoon — Restart</span>
<h5>дизайнер: Ray</h5>
<a href="https://i.imgur.com/WqBYfPo.jpg" target="_blank"><img src="https://i.imgur.com/WqBYfPo.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Бумажные Города</span>
<h5>дизайнер: Gatto</h5>
<a href="https://i.imgur.com/o2LdZvP.jpg" target="_blank"><img src="https://i.imgur.com/o2LdZvP.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>ARTiSHOCK</span>
<h5>дизайнер: сатаня</h5>
<a href="https://i.imgur.com/eXR8TlH.jpg" target="_blank"><img src="https://i.imgur.com/eXR8TlH.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Метавалломентов</span>
<h5>дизайнер: ocean</h5>
<a href="https://i.imgur.com/npwtInu.jpg" target="_blank"><img src="https://i.imgur.com/npwtInu.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span><br>Arcana septem stellarum</span>
<h5>дизайнер: Gatto</h5>
<a href="https://i.imgur.com/eGcNZTml.jpg" target="_blank"><img src="https://i.imgur.com/eGcNZTml.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>Sailor Moon — «Shattered Earth»</span>
<h5>дизайнер: Ray</h5>
<a href="https://i.imgur.com/uSC8Wi5l.jpg" target="_blank"><img src="https://i.imgur.com/uSC8Wi5l.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span><br>cross the binary</span>
<h5>дизайнер: честно, не помню ника</h5>
<a href="https://i.imgur.com/tZII6Trl.png" target="_blank"><img src="https://i.imgur.com/tZII6Trl.png" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>wizarding test</span>
<h5>дизайнер: сатаня</h5>
<a href="https://i.imgur.com/HP6eNwil.jpg" target="_blank"><img src="https://i.imgur.com/HP6eNwil.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site">
<span>APPARATE</span>
<h5>дизайнер: сатаня</h5>
<a href="https://i.imgur.com/z0fRTPQl.jpg" target="_blank"><img src="https://i.imgur.com/z0fRTPQl.jpg" alt="посмотреть в полном размере"></a>
</div>
<div class="site"></div>
</div>
</details>
<details>
<summary><h3>Коды, шаблоны и прочие фишки</h3></summary>
<div class="opis">
<span>Фильтрация элементов по критерию</span>
<p>Скрипт фильтра элементов по критерию. Полезно для списков, где есть элементы, отвечающие сразу нескольким критериям. Подробности тут: <a href="https://urchoice.su/viewtopic.php?pid=2170380#p2170380">ссылка</a>.</p>
<a href="https://i.imgur.com/Im4Ehm9.png" target="_blank"><img src="https://i.imgur.com/Im4Ehm9.png" alt="посмотреть в полном размере"></a>
</div>
</details>
</div>
</section>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>$(document).ready(function() {
$('.service').on('click', function(e) {
e.preventDefault();
$('.process').each(function() {
$(this).fadeOut(600);
});
var block = $(this).attr('href');
$(block).fadeIn(600);
$(this).addClass('active');
$('.wip').css('overflow','hidden');
});
$('a.close').click(function(){
$(this).closest(".process").fadeOut(600);
$('.service.active').removeClass('active');
$('.wip').css('overflow','auto');
});
});
</script>
</body>
</html>[/html]
Отредактировано Force (11-10-2023 14:23:08)
- Подпись автора
