основы веб дизайна

#tool
https://mockup.marco.land/

жаль мало мест и качество, но забавно

#insprrrrr
https://superiormerchandise.co/products/grass-green-sweatpants

внутренние цветные тени это стиль

#insprrrrr
https://drexler.store/

верстка в одну колонку на всю ширину это стиль

#insprrrrr
https://selftitled.work

черный текст на низкоконтрастном цветном фоне это стиль (а еще логотип, который вместо того, чтобы спокойно висеть в каком-нибудь углу, появляется и изчезает при загрузке страницы)

я не делаю дизайн, но за деньги да

мы? https://youtu.be/kTn0li1q1O0

#insprrrrr #prtfffff
https://taragraphy.com/

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

хорошо работает лоскутность лейаута. когда крупные обрезки из разных работ состыковываются друг с другом или накладываются друг на друга. создает впечатление большого объема завершенных проектов

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

но жаль видно, что это редимаг. по дерганью залипающих элементов при скролле. надеюсь когда-нибудь они полечат это

а еще тутор хороший от сплайна

истощенный референсным голодом (а в последнее время как-то совсем ничего интересного не попадается), был вынужден пойти на крайние меры и порыться в своих сохраненках. что обычно не делаю, так как собираю там все и бережно храню на старость

где наткнулся на давно мной отложенный ютуб Романа Белякова (@krch_rmn). в котором четыре видео, но все прекрасны. и часовое молчаливое плакатирование солнца в фотошопе под аккомпанемент индийских песнопений. и второе часовое видео про плакат с цветком, но уже с комментариями. и, особенно запавшее мне в сердце, видео как сделать цветы из букв одной кнопкой в иллюстраторе

но самое самое, на мой взгляд, это видео как сделать буквы из фото за 10 минут (и 53 секунды). одновременно захотелось и попробовать, и поделиться, и докинуть домашкой в какой-нибудь из моих курсов

пока только делюсь, остально как будет время https://youtu.be/HBoQAs5TbGU

смотрю vanok.regular, присмотрелся нет, не vanok.regular

baestard.atelier

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

это у меня с детства, не выношу неловкие моменты, даже на экране. все остальное выношу, а это нет

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

‘If you believe in it enough, people might also believe in what you’re doing’

https://youtu.be/HjuP527Xt2Q

еще кое-что про редик и кастомный код

скорее всего выборка по document.getElementById() не пригодится совсем, потому что в коде редика почти не используется id=“”. а вместо этого юзается атрибут data-id=“”, а это другое

поэтому для выборки нужно будет использовать document.querySelector('[data-id=""]’). где в квадратных скобочках можно указывать любой атрибут, тот же class=“”, например

еще часто нужно выбрать дочерний элемент внутри элемента с data-id=“” и тут можно указать последовательность document.querySelector('[data-id=“”] [class=“”]'), где вместо [class=“”] можно указать просто тег a, div или span (также как в css):

let ex1Layer = document.querySelector('[data-id="64fd9b4592a4fc002f0abba4"] div');

главное не забыть весь код обернуть в функцию проверки загрузилась ли страница и, на всякий случай, еще в дилей:

<script>
window.addEventListener('load', winLoad, false);
function winLoad(){

window.setTimeout(function() {

// твой код

}, 1000);
};
<script>

это что касается js. но в css тоже так можно:

[data-id="64fd9b4592a4fc002f0abba4"]{
background: red;
}

простите за техдухоту. оставляю памятку себе на будущее и надеюсь, что кому-то еще пригодится

https://codepen.io/armandocanals/pen/WWXZMB

держите js слежения за курсором. в редике нет такой штуки, нашел на просторах кодпена. очень простой

в mouseOverContainer кладем родительский элемент, над которым будет отслеживаться курсор. а в ex1Layer элемент который будет трансформироваться

еще есть параметр constrain. тут чем крупнее элемент, тем выше цифра должна быть. у меня 1000, например

https://dota2data.io/

вызвался помочь с лендом на редике (и еще с разными штуками) для хакатона по доте. причина, почему я молчал две недели

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

в целом мне нравится, что получилось. но больше так не хочу, совсем выпал из жизни

смешная реклама у спутников

https://aau-product.com попал в совместную подборку редимага и баунтихантерс ‘файв инспайринг интерактив вебсайтес’. и пусть до этого я знать не знал о существовании баунтихантерс, но приятно все равно. тем более, что на них подписано много хороших ребят из тех, на кого подписан я