И тут же сразу на русском:
Про вёрстку ссылок в вебе — https://medium.com/design-soviet/-bb2495ed8c3d#.5w8at3xlm
На английском:
О флекбоксе в верстке
https://davidwalsh.name/flexbox-layouts
Вопрос: насколько релативен флексбокс?
Ответ: Очень, пруф http://caniuse.com/#search=flexbox
Как видно за бортом остается ИЕ 9 и меньше.
http://antonz.ru/2015/04/01/longread/
Отличная быстростатья на русском про то, как разбавить текст.
С иллюстрациями думаю знакомы все, а вот фактоиды — они обычно не идут в комплекте, зато их можно вычленить самому или разузнать, клиенты обычно не против. Фактоид может быть как в стиле "преимущества" или же просто факт.
Примеррилейтед. Слева — илююстрация, справа — фактоид.
Кстати кто не умеет вырезать фотки на белый фон — срочно учиться. Жизненно необходимый навык.
Отличная быстростатья на русском про то, как разбавить текст.
С иллюстрациями думаю знакомы все, а вот фактоиды — они обычно не идут в комплекте, зато их можно вычленить самому или разузнать, клиенты обычно не против. Фактоид может быть как в стиле "преимущества" или же просто факт.
Примеррилейтед. Слева — илююстрация, справа — фактоид.
Кстати кто не умеет вырезать фотки на белый фон — срочно учиться. Жизненно необходимый навык.
Пили ещё
Кстати, еще один небольшой тип:
Настоящий черный хтмл-а не очень подходит для каких-либо целей, слишком сильный контраст между белым может начать рябить, поэтому рекомендую как в Смешинг использовать #333
для черного текста и других целей. (Запомни это число)
Кстати, любой серый оттенок будет в вебе иметь структуру #xyxyxy или #xxxxxx, то есть #333 станет #333333, а светло-серый #fb станет #fbfbfb.
Если что-то неправильно — поправляйте.
Настоящий черный хтмл-а не очень подходит для каких-либо целей, слишком сильный контраст между белым может начать рябить, поэтому рекомендую как в Смешинг использовать #333
для черного текста и других целей. (Запомни это число)
Кстати, любой серый оттенок будет в вебе иметь структуру #xyxyxy или #xxxxxx, то есть #333 станет #333333, а светло-серый #fb станет #fbfbfb.
Если что-то неправильно — поправляйте.
Посоны, мне тут предложили вебдизайнером с большим уклоном на ux, а я до этого больше с видео работал и с играми. Просто знакомый краем уха слышал, что я дизайнер и предложил. Говорит фирма серьезная и таких шансов мало бывает. И я хочу туда. Подскажите что-нибудь энтри лвл про UX-design. И что потом уже можно почитать.
Видео курсы:
https://www.coursera.org/learn/human-computer-interaction
На английском, состоит из трех частей, скоро начинается.
По-русски о ЮХ: https://medium.com/ux-crash-course
еще https://medium.com/ux-ux-protips
и еще http://habrahabr.ru/company/friifond/blog/250605/
На английском почитать: http://www.measuringu.com/blog/getting-started.php
От себя могу сказать, юэкс это о том, как сделать просто и доступно, чтобы даже даун мог пользоваться + проработать сценарии. Кстати еще на юдасити есть что-то по этой теме. Они там много вывалили новенького.
Благодарю! В играх тоже с интерфейсом подобное было, но я чаще отрисовывал готовые gui, чем дополнял их.
есть ещё что по UX почитать?
можешь подробней рассказать о своей работе? процесс, какие задачи были? очень интересно
годный тред. Оп — молодец
Вот курсы с юдасити на английском:
https://www.udacity.com/course/ux-design-for-mobile-developers--ud849
https://www.udacity.com/course/product-design--ud509
Очень тщательно всё разжевывают.
И еще подробка с хабра:
http://habrahabr.ru/post/247493/
>можешь подробней рассказать о своей работе? процесс, какие задачи были? очень интересно
Мы инди-хуинди, нас всего трое, поэтому какого-то четкого процесса у нас нет и какие-то вещи типа дизайна уровней делали все вместе. Я всю графику рисовал, персонажи, бг. Потом мне скидывали интерфейс кружочками и квадратиками, я все это дело рисовал в стиль нашей игры, а потом программист разрезал чтобы под все популярные размеры мобил, планшетов и под пеку одинаково гармонично смотрелось. Вот и вся моя работа над ui до вчерашнего дня.
Сам я еще вот такое на рутрекере скачал по ux http://rutracker.org/forum/viewtopic.php?t=5082346
Это совсем для ньюфагов.
благодарю за ответ.
поясните за подобные пикчи
вот какой в них толк? на дриббле куча такой срани, в вк репосты дриббла с сотней лайков.
где это используется кроме дриббла? в каких интерфейсах? честно говоря, не доводилось видеть в реале такие карточки продукта.
Конечно, это красиво выглядит. Да, как прием, допустимо. Но их же сотни - только цвет кроссовок меняется, каждый мамкин дезигнер пилит такие пикчи.
Я не пойму.
Это как подиум, рик овенс например, показывают что-то совсем нереальное — потом тренды переплывают в деталях на реальное использование. Ведь именно весь флэт и начался собственно с дрибла.
К слову, в этой форме ничего такого что нельзя сверстать, поэтому всё лишь зависит от заказчика, я не в курсе именно таких моднючих сайтов, но бывает проскакивает, не всё на дриббле делается в стол (еще кстати время разработки накладывается, проект можно пилить год, и через год ты скажешь, мол, пиздец, видел это еще год назад, где тренд то?).
Кстати вряд ли ты нарисуешь такую форму — а если сможешь, просим работу в тред ; )
https://medium.com/@erqiudao/how-to-make-awesome-charts-for-your-presentation-with-only-circle-in-sketch-4392f3ffd9e0#.74xa2t8y8
На ангельском небольшой тутор для скетча.
На ангельском небольшой тутор для скетча.
Че-то мелко, побольше.
Бред какой-то. Флэт начался не с дрибла, а с майкрософта.
З.ы насчёт остального соглсен
Ворвусь в тред и посоветую незнающим подписаться на jvetrau.com. Там директор по интерфейсам из mail.ru выкладывает выжимки полезнейших материалов за месяц.
Плюс, можно подписаться на uxfox.com, там тоже много полезностей и интересных статей по юиксу. Пока всё, из-за больной головы не могу вспомнить еще штуки всякие.
Плюс, можно подписаться на uxfox.com, там тоже много полезностей и интересных статей по юиксу. Пока всё, из-за больной головы не могу вспомнить еще штуки всякие.
Разбор юэкса и юия разных тревельных компаний. Довольно таки занимательно — читается легко. На английском.
http://www.smashingmagazine.com/2015/11/airline-websites-2015-front-end-performance-ux-lessons-learned/
Вообще предлагаю всем начинающим дизайнерам отказаться от слайдеров (в большинстве случаев) в пользу последовательного изложения.
http://www.smashingmagazine.com/2015/11/airline-websites-2015-front-end-performance-ux-lessons-learned/
Вообще предлагаю всем начинающим дизайнерам отказаться от слайдеров (в большинстве случаев) в пользу последовательного изложения.
Пикрил — дизайн, отличный, смысла — 0. Не делайте так.
Ни у кого сушенная трава и перец чили не вызовет желания поесть, даже у тайца.
Пик отсюда https://medium.com/@lonelyplanet/designing-destinations-at-lonely-planet-df2a2fc8f7df#.nk7qnbf9t
Можете посмотреть в плане визуального представления, но с юэксом там всё глухо — будьте осторожны.
Ни у кого сушенная трава и перец чили не вызовет желания поесть, даже у тайца.
Пик отсюда https://medium.com/@lonelyplanet/designing-destinations-at-lonely-planet-df2a2fc8f7df#.nk7qnbf9t
Можете посмотреть в плане визуального представления, но с юэксом там всё глухо — будьте осторожны.
Малаца.
-ОП
что ОП по поводу Адоб Мьюза думает?
Перспективная прога? Использует ее или нет?
Нет, не использую, поэтому ничего не могу сказать.
Вообще ноу-коуд программам отношусь скептично, иногда сам думаешь как забацать тот или иной лейаут, куда уж машине...
Верю что однажды всё таки надобность в верстальщиках отпадет.
Итак, свежак сегодня, всё на английском, почаны:
This is Responsive by Brad Frost
http://bradfrost.github.io/this-is-responsive/patterns.html
Overhauling mobile.twitter.com from the ground up
https://blog.twitter.com/2012/overhauling-mobiletwittercom-from-the-ground-up
Учимся у твиттера.
И небольшой тип в пикрелейтеде из "Настольной книги газетного дизайнера" — рекомендую всем и каждому здесь.
This is Responsive by Brad Frost
http://bradfrost.github.io/this-is-responsive/patterns.html
Overhauling mobile.twitter.com from the ground up
https://blog.twitter.com/2012/overhauling-mobiletwittercom-from-the-ground-up
Учимся у твиттера.
И небольшой тип в пикрелейтеде из "Настольной книги газетного дизайнера" — рекомендую всем и каждому здесь.
Немного воркфлоу в скетче, на самом деле много лишних движений, парень не работает эффективно в плане движений мышью. Зато карточка ничего.
https://www.youtube.com/watch?v=kAIBhBLO5sc
https://www.youtube.com/watch?v=kAIBhBLO5sc
Строго говоря, текст говорит о том, что читать его легко, однако всё наоборот. Только это не из-за левого флага, а из-за руки, которая оттягивает внимание. К тому же, глаза спотыкаются на переносах, а выравнивание по левому полю как раз помогает избежать переносов.
Смуззи уже навернул?
>что читать его легко, однако всё наоборот. Только это не из-за левого флага
Левый флаг вообще самая читабельная конструкция, не понимаю о чем ты. Смотри пик полностью.
Хочешь угостить, сладкий?
http://artgorbunov.ru/bb/soviet/20151230/
Короткий совет сегодня, плакат с хорошей и крепкой версткой.
Короткий совет сегодня, плакат с хорошей и крепкой версткой.
На английском: как практиковаться, почему нельзя слепо дрибблить и где искать что бы редизайнуть.
https://medium.com/swlh/stop-dailyui-start-fixui-e685acc6858f#.fnhzjfhc6
На русском: Эмиль Рудер, Типографика.
На самом деле моя первая книга купленная по дизайну, перелистываю ее время от времени, там и про композицию есть, и про совсем неочевидные вещи тоже пишет.
http://www.newsman.tsu.ru/wp-content/uploads/library/Typographics.pdf
https://medium.com/swlh/stop-dailyui-start-fixui-e685acc6858f#.fnhzjfhc6
На русском: Эмиль Рудер, Типографика.
На самом деле моя первая книга купленная по дизайну, перелистываю ее время от времени, там и про композицию есть, и про совсем неочевидные вещи тоже пишет.
http://www.newsman.tsu.ru/wp-content/uploads/library/Typographics.pdf
Пришла рассылка с инвижона за год, есть что почитать — всё на английском.
http://get.invisionapp.com/15-most-popular-design-articles-of-2015
От себя: рекомендую когда текст белый и контраст не очень четкие, немного поддавать тенью, спиздил тип с «Книги газетного дизайнера»
Пикрелейтед
http://get.invisionapp.com/15-most-popular-design-articles-of-2015
От себя: рекомендую когда текст белый и контраст не очень четкие, немного поддавать тенью, спиздил тип с «Книги газетного дизайнера»
Пикрелейтед
Нарисовал с туториала. Нормально, надо учиться применять множественный тени, а то чо как лох.
https://medium.com/google-design/sketch-tutorial_01-b76271a095e3#.6taif22qf
https://medium.com/google-design/sketch-tutorial_01-b76271a095e3#.6taif22qf
В общем надо поставить цели на год, составлю пока сюда примерный список:
1. Больше практиковаться css/html, собрать минимум 3 своих макета.
2. Подогнать джейэс и джейквери.
3. Пересесть на скетч полностью для макетов.
4. Отрисовать не менее 12 веб-проектов. (один в месяц — оки)
5. Отрисовать первый мобайл-макет минимум 5 экраном и прототипировать любым тулом. (скорее всего фреймер или инвижон)
6. Отрисовать 3 полных мобайл-приложения.
7. Прочитать не менее 12 книг.
8. Не вылететь из универчика по ходу дела, лол.
9. Опционально обновить макбук, или хотя бы этому батарею сменить, вообще думаю, может аймак?
10. Найти какую-нибудь удаленку, опционально.
11. Осилить грант и бовер.
12. Не помереть и не превратиться в дрыща.
1. Больше практиковаться css/html, собрать минимум 3 своих макета.
2. Подогнать джейэс и джейквери.
3. Пересесть на скетч полностью для макетов.
4. Отрисовать не менее 12 веб-проектов. (один в месяц — оки)
5. Отрисовать первый мобайл-макет минимум 5 экраном и прототипировать любым тулом. (скорее всего фреймер или инвижон)
6. Отрисовать 3 полных мобайл-приложения.
7. Прочитать не менее 12 книг.
8. Не вылететь из универчика по ходу дела, лол.
9. Опционально обновить макбук, или хотя бы этому батарею сменить, вообще думаю, может аймак?
10. Найти какую-нибудь удаленку, опционально.
11. Осилить грант и бовер.
12. Не помереть и не превратиться в дрыща.
Такс такс такс, книжки книжечки: https://blog.pttrns.com/great-books-for-designers-to-read-in-2016-d2ebea3763f4#.pvrf2arr2
Начал прототипировать в принципле, несложно, но можно легко запутаться.
Туториалы у них на сайте:
http://principleformac.com/tutorial.html
Туториалы у них на сайте:
http://principleformac.com/tutorial.html
Кстати еще немного есть на скетчаптв:
https://www.youtube.com/playlist?list=PLgwNtYvZGv9STGDSx_knjYyzS7XzmpK84
http://blog.invisionapp.com/7-tips-for-designing-awesome-gifs/
Как делать хорошие гифки, над читнуть позже, на сегодня хватит уже.
Как делать хорошие гифки, над читнуть позже, на сегодня хватит уже.
А для пеки есть аналоги screenflow? Раньше ебался и отрысовывал каждый кадр в фш, а тут как-то изи
>отрисовывал
долгофикс
Если честно — не знаю, сам работают с мака, может АЕ?
На англицком про флексбокс:
Flexbox For Interfaces All The Way: Tracks Case Study
http://www.smashingmagazine.com/2015/11/flexbox-interfaces-tracks-case-study/
Crafting Twelve-Column Layouts with Flexbox
https://davidwalsh.name/flexbox-layouts
И на русском, "Флекс-гроу странный":
http://css-live.ru/articles/flex-grow-strannyj-tak-li-eto.html
Сколько бы не говорили что флекбокс прост — но судя по количеству статей нихуя подобного.
Может все уже знают, но я только недавно для себя открыл font awesome и вброшу вам на всякий случай https://fortawesome.github.io/Font-Awesome/cheatsheet/
Качаем шрифт, а потом ищем нужную иконку в этом читшите, копируем и вставляем в ваш редактор. Дальше можно конвертировать в кривые.
Качаем шрифт, а потом ищем нужную иконку в этом читшите, копируем и вставляем в ваш редактор. Дальше можно конвертировать в кривые.
Айкон фонтсы хороши, но у них есть и минусы:
https://www.designernews.co/stories/12515-ten-reasons-we-switched-from-an-icon-font-to-svg
Я тоже пользуюсь СВГ, программой http://geticonjar.com/
У них там есть годные сеты, ну или по старинке пнг.
Свежая рассылка с инвижон на английском:
http://get.invisionapp.com/weekly-digest-1-2016
Ну я их как базу беру, чтобы потом конвертировать в кривые. Не собирался подгружать к сайту.
За айконджар спасибо.
Привет. Недавно подключился к одному проекту в качестве дизайнера. Проект бесплатный, поэтому согласился, так как давно хотел попробоваться в юи и вебе (сам иллюстратор-3дшник). И что-то я не думал, что все будет так сложно.
Для начала оказалось слишком геморройно отрисовывать макеты в фш (наверное поэтому так популярен теперь скетч). Куча папок, слоёв. В итоге более менее разобрался, стал использовать по-максимуму смарт-обжектс и тд для упрощения работы.
Проект оказался тоже довольно сложным, требующим нестандартных решений и тут я закопался. Я надеялся отрисовать просто дизайн по прототипу, оказалось по-ходу рисования нужно еще допиливать структуру сайта и допиливать функционал.
Поэтому хотел спросить, есть ли где-то статьи для совсем общего понятия о воркфлоу? Например, о структурировании и иерархировании элементов, структуре самого сайта?
Сейчас у меня самые актуальные вопросы следующие:
— нужно разобраться с понятием масштаба страницы, чтобы не париться с разными разрешениями(необходимо четко соблюдать "экранность", чтобы определнная инфа отображалась только на одном экране без прокрутки, а верстальщик мыслит пикселями до сих пор)
— нужна какая-то статья о привычном для людей поведении элементов (например, не могу уговорить людей на привычную кнопку "далее", им кажется, что страница должна прокручиваться, как только человек выполнит сценарий на странице (сделает выбор в последнем пункте меню))
Ну и вообще, как начать рисовать пиксель-перфект и как объяснять верстальщику идеи об эффектах на странице? С каким транзишном должны появляться подсказки и тд? Понятно, что нужно в идеале верстать самому.
Для начала оказалось слишком геморройно отрисовывать макеты в фш (наверное поэтому так популярен теперь скетч). Куча папок, слоёв. В итоге более менее разобрался, стал использовать по-максимуму смарт-обжектс и тд для упрощения работы.
Проект оказался тоже довольно сложным, требующим нестандартных решений и тут я закопался. Я надеялся отрисовать просто дизайн по прототипу, оказалось по-ходу рисования нужно еще допиливать структуру сайта и допиливать функционал.
Поэтому хотел спросить, есть ли где-то статьи для совсем общего понятия о воркфлоу? Например, о структурировании и иерархировании элементов, структуре самого сайта?
Сейчас у меня самые актуальные вопросы следующие:
— нужно разобраться с понятием масштаба страницы, чтобы не париться с разными разрешениями(необходимо четко соблюдать "экранность", чтобы определнная инфа отображалась только на одном экране без прокрутки, а верстальщик мыслит пикселями до сих пор)
— нужна какая-то статья о привычном для людей поведении элементов (например, не могу уговорить людей на привычную кнопку "далее", им кажется, что страница должна прокручиваться, как только человек выполнит сценарий на странице (сделает выбор в последнем пункте меню))
Ну и вообще, как начать рисовать пиксель-перфект и как объяснять верстальщику идеи об эффектах на странице? С каким транзишном должны появляться подсказки и тд? Понятно, что нужно в идеале верстать самому.
Привет, давай немного пройдусь по твоим вопросам, параллельно кидая ссылки по теме.
Первое, если так важен фотошоп, то используй артборды в последних версиях, это очень сильно упрощает работу, и позволяет следить за стилями в общем. По крайней мере не будет проблем с тем, что запутаешься в макетах.
Второе. Тут, как я понял, ты сам запутался сильно, так как получил довольно большой проект. Начни с карты сайта. Распиши все страницы, начиная с главной, и нарисуй основные переходы по ним, так ты поймешь что первостепенно, а что можно оставить на потом. Посмотри на конкурентов, проанализируй их удачные и неудачные ходы. Основные этапы очень хорошо написаны у тильды: http://tilda.education/courses/web-design/basicsteps/
Про масштаб. Если у тебя проект большой (не в плане количества страниц, а в плане сценариев, информации и её архитектуры), то всегда, всегда(!!!) делай mobile-first. Собственно, это уже опыт из жизни, когда работал над тяжелым проектом, мне поручили делать дизайн по варфреймам и тз приглашенного компанией ux-специалиста. За это время понял, что он ни одну из задач не выполнил, сделал всё халтурно, ничего толком не решил и увел всё в какие-то дебри. По разрешениям бери четыре основных: 320 для мобильных, 1024 для планшетов и небольших мониторов, 1280 для стандартных экранов, и если есть время и желание, сделай версию для широкоформатных мониторов в 1980. http://baymard.com/blog/responsive-upscaling (перевод есть на медиуме, могу кинуть отдельно, а то не знаю как ссылки вставлять оттуда. Их пидорасит на пять строк) вот тут про большие мониторы и работу с ними. Сайт в мобильной версии старайся приблизить к фунционалу приложений, то есть ориентируйся на mobile-ux, по нему ничего в голову не приходит, там выше много ссылок.
Про взаимодействие с программистами. По хорошему, стоит связаться с верстальщиком и пояснить где у тебя есть прокрутка, а где не будет. Это можно сделать и в небольшом файле вложении, например. Тут миллионы способов, но общение ничего не заменит. Собственно, то же про эффекты. Есть простые эффекты, уровня hover и active на кнопках, их можно отрисовать в макете (идеальный вариант, если они статичны), можно найти примеров в движении на codepen.io и поскидывать верстальщику. Всякие анимации и подобное вы уже обсуждаете с ним вместе. http://i-love-psd.ru/
Длительность анимации и её влияние. НЕ ДЕЛАЙ ЭТО ЧАСТО. Анимируй важные элементы, которые должны привлечь внимание пользователя. В среднем хорошим таймингом будет 0.2-0.3s, это по общему мнению позволяет взгляду зацепиться, не является резкой анимацией, и при этом не затянутой. Плюс, например, если у тебя анимируется один элемент, с которым пользователь может взаимодействовать, например, карточка товара, то лучше сделать важный элемент с отдельной анимацией. То есть, у тебя появляется сначала сама карточка, а через секунду кнопка, на которую пользователь должен нажать, с разницей в 0.1-0.2s . Написал криво, надеюсь поймешь. С анимацией, с принципами диснеевскими и прочей модной хуйней ты, я думаю, знаком.
Про поведение людей. Тут довольно сложно и зависит от ситуации. Единственное, что можно сказать точно. так это то, что люди скроллят всегда, но часто останавливаются на каком то проценте экрана и забивают, если информация их не интересует. Можно объединить два ваших подхода. То есть важно определить момент, когда человек перестанет скроллить, и предложить ему жмакнуть кнопку далее. Либо разобраться с подачей информации. http://www.hugeinc.com/ideas/perspective/everybody-scrolls , «Облик Книги» для работы с текстом и версткой.
Надеюсь всё зацепил и написанное понятно. Если нет, то спрашивай, я захожу раз в день-два, обязательно отвечу.
еще, надеюсь, макаба не поломает это сообщение, а то я старался
бро, толково все расписываешь. малаца!
Можешь вот так же написать про дизайн мобильных приложений. У меня какой-то пещерный страх перед ними.
Смотрю биханс/дрибл - вроде все просто, пасаны пиксели туда-сюда двигают, да с цветами играются. А как самому что-то сделать, даже для теста, сразу тухнет энтузиазм - а если что-то не так запилю, а если так нельзя, а если разработчику не так отдам, в эти разрешениях запутаюсь.
Сам-то и сайтов и интерфейсов хренову тучу уже наделал, а для моб. приложений ещё не пришлось. Может потому, что сам особо не залипаю в смартфоне, и не в курсе всех трендовых приложений, хз.
Вообщем, на что в первую очередь стоит обратить внимание, какие самые нелепые ошибки, что почитать полезного?
Принесу вам немного про анимацию, чювак прррросто охуенно разлагает:
http://tobiasahlin.com/blog/curved-path-animations-in-css/
http://tobiasahlin.com/blog/curved-path-animations-in-css/
С мобильными всё довольно просто, на удивление. Все разрешения описаны заранее, размеры блоков и их поведение тоже, делать под мобилки легко и интересно. За основу берешь лишь одно-два основных и популярных разрешения. Просто гугли статистику по айфонам, например (очень много людей пользуются пятым и четвертым, под них и делаешь, как вариант). Гайдлайны хорошие есть тут: http://iosdesign.ivomynttinen.com/ (по яоси и её элементам) и https://design.google.com/resources/ (у гугла тут всё подробно описано).
Почитать про мобильный ux есть много чего. Но там всё ограничивается постоянно примерами других приложений и подобной херней. От себя могу посоветовать https://www.thinkwithgoogle.com/intl/en-gb/article/mobile-app-ux-principles-improving-user-experience-and-optimising-conversion/ вот эту хорошую вводную статью, http://blog.shaihalov.ru/2015/11/16/nepravilno-ispolzuemye-mobilnye-ux-patterny/ вот эту про ошибки в паттернах поведения, https://medium.com/startups-venture-capital/your-ui-isn-t-a-disney-movie-703f7fbd24d2#.ecfu8pyso вот эту про анимацию в мобильных (и не только) интерфейсах.
Все основные размеры есть в гайдлайнах, но от себя могу добавить, что довольно важные кнопки не стоит делать меньше размера зоны соприкосновения пальца и экрана, а это порядка 34x34px. Плюс, если у приложения нестандартный функционал, то надо провести совсем небольшую экскурсию по нему, (но это важно делать правильно, была статья, не могу найти, может помогут). Еще, стоит понимать, что часто телефон держат либо в небольших перерывах в работе, либо в поездке на транспорте, либо в кафе. То есть, часто у них нет особо времени задуматься, понять куда им жмакать и что делать, поэтому интерфейсы должны быть максимально простыми, чтобы не возникало лишних вопросов.
Еще есть возможность геймофикации интерфейса, но я, честно говоря, не находил статей про это, да и не доводилось попробовать в реальных проектах. Если у кого то есть статьи, скиньте пожалуйста.
Посоны, рейт дизайн http://rafe.ru
Бек ту 2008
А 2016 дизайн это как сайт майкрософта?
Заставил меня впервые зайти на микрософт — да.
Лол, этот скролл, на 1 странице несколько страниц - разве не убого?
>Лол, этот скролл, на 1 странице несколько страниц - разве не убого?
Не знаю, у меня ничего такого, капчую из европки. Тут просто главная с большой листалкой на главной и какие-то промоблоки.
www.cdsantos.github.io/jquery-drawsvg
Охуевший джейквери для анимирования свгшек простяцкого. Охуенно, накачал себе иконок под вечер, день удался епт.
Кстати в бюро разобрали типичный говно-лендинг:
http://artgorbunov.ru/bb/soviet/20160106/
А Штанг вывесил несколько веб-работ в блоге:
http://nobelfaik.livejournal.com/
Не представляете — но адаптивненько! Что для бюрошника вообще через голову переступить, хотя он от них отбился немного.
Охуевший джейквери для анимирования свгшек простяцкого. Охуенно, накачал себе иконок под вечер, день удался епт.
Кстати в бюро разобрали типичный говно-лендинг:
http://artgorbunov.ru/bb/soviet/20160106/
А Штанг вывесил несколько веб-работ в блоге:
http://nobelfaik.livejournal.com/
Не представляете — но адаптивненько! Что для бюрошника вообще через голову переступить, хотя он от них отбился немного.
Вот, что ты тут хорошего увидел?
ЭТО ЖЕ СТАНДАРТНЫЙ МАКЕТ КАРТОЧКИ ТОВАРА В ЛЮБОЙ МАЛО-МАЛЬСКИ НОРМАЛЬНОЙ ТЕМЕ. Еще и не ясно лайк типа нажат уже, ибо, если нет, то хули он такой главный, вместо кнопки, и шара убранная под кнопку снижает и так не высокий процент кликов в ноль. Ну, отступы нормально отсупили лол. А это ебаная стилизация фоток на деле никогда не работает, если в магазине более 100 товаров, и они постоянно обновляются.
Заебали с концептами в вакууме. Миллионы их, а используются хоть как-то на 0,5 промо-сайтах. Тогда, как никто не пилит концепты на типовые задачи в условиях безумства контента, котоырй готовит не дизайнер, ибо хули там пилить-то, да.
ЭТО ЖЕ СТАНДАРТНЫЙ МАКЕТ КАРТОЧКИ ТОВАРА В ЛЮБОЙ МАЛО-МАЛЬСКИ НОРМАЛЬНОЙ ТЕМЕ. Еще и не ясно лайк типа нажат уже, ибо, если нет, то хули он такой главный, вместо кнопки, и шара убранная под кнопку снижает и так не высокий процент кликов в ноль. Ну, отступы нормально отсупили лол. А это ебаная стилизация фоток на деле никогда не работает, если в магазине более 100 товаров, и они постоянно обновляются.
Заебали с концептами в вакууме. Миллионы их, а используются хоть как-то на 0,5 промо-сайтах. Тогда, как никто не пилит концепты на типовые задачи в условиях безумства контента, котоырй готовит не дизайнер, ибо хули там пилить-то, да.
Да какой подиум, блин. Там одинаковое все ведь, а когда пытаешься применить какие-то элементы натыкаешься на кучу тех.ограничений, вот, если бы они интерфейсы уже сверстанные постили - было бы дельно.
У упомянутого Рика нормальные коллекции шмоток, странная херня только на шоу, и только как элемент шоу, которое соседствует с сутью вполне носибельных шмоток, да, бывают показы шмота и совсем ебанутого, но там в другом суть, нехер это сранивать с говно картинками, это можно сравнить с презентациями хололенс и типа того.
Я специально отослал к говно карточке (именно таких интерфейсом там большинство), а не к той выше про Найк. Ее я хоть понимаю где можно использовать, подобное на всяких промо-сайтах коллекций того же Найка можно увидеть. Ну и теоретически использовать на аналогичном.
Ощущение, что все это ориентировано на презентации, чтоб всякие тендеры выигрывать и работу у хипстеров-детей-инвесторов получать. На это дрочат, пихают в проекты, потом этим говном пользоваться невозможно.
Я тебе так долго писал, но всё скинулось нечаянным движением вправо, короче суть в том что ничего криминального эти люди не делают.
Сейчас можно сверстать всё что угодно, а на кодихаус вообще выставляют готовые темки именно по шотам с дриббла.
>работу у хипстеров-детей-инвесторов получать
Ну и заебись, тоже так хочу, мы же не детей тут убиваем.
А плохой интерфейс никогда не приживется просто так — дарвинизм в действии.
Увидел сегодня вот такую классную деталь, к вечеру попробую ее оживить с помощью приницпла.
Ну и качество, блять. А мув борда не поддерживает.
Кстати, я ищу работу, вдруг мимо проходимцы увидят.
[email protected]
Криминального-то нет ничего, просто все это как-то странно. Впрочем, вроде как именно за этот странный дрочь и платят. Вот, сегодня ходил на собеседование, мне там так и сказали. Мол, срать на суть, главная в жопы наебаться со всякими картинками и презентациями. Я пытался возразить, мол, это все круто, но чому в портфолио все какое-то кривое (в плане того, что мне показывали няшное видео презентации сайта, все там такое анимирвоанное дохуя, а потом заходили на реальный сайт, и там все работало не так уж и няшно), ну, мне сказали, мы стремимся. Хотя можно было сделать все сделать по-простому, но зато не глючно. Но, видимо, этим потом не получается выпендриваться и йоба-заказы получать.
https://www.smashingmagazine.com/2016/01/learn-from-the-history-of-banknote-design-most-desirable-product/
Про дизайн денег на английском.
Про дизайн денег на английском.
Webm поддерживает, епты!
Затещю, ночное лоу-фиделити.
А как подобное реализовывают в коде? Есть какие-то йоба-либы для такого? Я уж не про прелоад, а просто вот эта занятная анимации. Я более-менее представляю как почти все показанное сделать на одном jq, но будет говнокодисто, а как это полоска синяя так хитро станет бордером хедера - вообще не представляю.
в чём ты такую анимацию делаешь?
Знаю что у фейсбучного тула есть какие-то миграционные штуки, но в принципле кажется ничего такого. Зачем джейквери? Тут все можно давно на чистом css бахнуть, а вот и код для полоски http://codepen.io/anon/pen/WrOKdK
потом бордер можно щелчком сделать визибл, а полоску вырубить. Вендорные префиксы не писал, да и собственно вообще вчера тренировался джаст фо фан.
Principle, но если нет мака, то еще куча аналогов.
>бордер можно щелчком сделать визибл, а полоску вырубить
Вот тут, на деле окажется не так няшно, как на видео, сдается мне.Одно вырубится, другое не врубиться во время, какое-нибудь мерзкое подергивание появится. Нет ссылки на заверстанный лайаут с большим количеством такой анимации? (желательно ровная-четкая демка, а не вырванный из фейсбука какого-нибудь)
Посоветуйте что-нибудь по такой карточке. И как сделать моднее, но без потери удобства и понимания? Статус обозначается цветной полоской слева, остальное, вроде, понятно?
Мелковато, это 8 – 9 кегль?
"Запросить" с большой буквы. Сейчас больше похоже на бирку чем на кнопку.
Иконка "поделиться" не та, это иконка "ответить".
Что значит отправлено? Куда отправлено?
http://artgorbunov.ru/bb/soviet/20150701/
Это 10 и 11, заголовок 18
"Запросить" — это ghost button, на сайте они используются в других местах (при наведении инвертируется), плюс логически действие отличается от всех других, поэтому на вид кнопка другая.
Для "поделиться" какая иконка лучше?
"Отправлено" — это статус обращения. Там выпадающее меню, где можно выбрать текущий статус (отправлено, решено, отказано и тд)
Вечером вернусь домой, попробую переделать.
Какие-то странные размеры почти всего — неровные.
Короче как-то так, зависит от того главное ли это действие пользователя — запросить статус.
Если высота не фиксирована, то превьюшки можно кинуть под главное фото.
И справа будет больше дышать. Кнопку тоже покрупнее.
первое что в глаза бросилось
наркоман )))
Не факт, такие вещи часто ищут по фотке сперва.
факт в том, что фотки скорее всего будут говном, так что ставить это говно первым смысла нет
Какая разница говно или нет? Если есть задача четко найти свое говно.
ну хз
Еще подвигал...
Бдыщ, карточка, завтра замучу еще несколько и попробую анимировать с функцией 3д-форс.
Короче тред превращается медленно в мои работы, но надеюсь кому-нибудь интересно. В общем я думал как же я все это дело анимирую и собрал легкий каркас, чтобы завтра представлять с чего начинать.
Кстати, сегодня ровно год как я в дизайню.
А еще я учу 10-пальцевый метод печати, поэтому жизнь — боль.
http://prgssr.ru/development/sekrety-rezhimov-nalozheniya.html
Секреты режимов наложения
Секреты режимов наложения
Ну-ка, мойша дизайнеры, процесс "в корзину" явно не правильный вышел — должен ли лететь сам товар? Или ок?
Нормально. Разве что анимацию плавнее как-то сделать: может медленнее и элегантней.
Добавить цифру при приземлении, и слишком быстро кружком стает, может вообще не делать кружком? И попробовать типа приклейтеда.
А вообще карточка недостаточно йоба, раз уж предполагается такая замарочка с фоном, то и саму карточку стоило бы еще поддизанить интереснее, хотя бы бейджик с ценой как-то занятнее (и добавить пустую строку, на случай, если название в одну не влезет).
ОП, а что делать, если умных статей почитал, проникся, рисовать в фотошопе что-то умею, css только на уровне 2010 года, html слабовато? Делать уроки? Пилить примеры? Придумывать себе задачи?
Алсо, что делать, если у меня винда? Чем заменить скетч?
Алсо, что делать, если у меня винда? Чем заменить скетч?
Практикуйся, епта. Сделай знакомым сайт на шару за пивасик Задрочи софтину, до хорошего уровня, потом за цсс принимайся, если нравится он тебе.
https://youtu.be/EgImRV_h4dc
>ОП, а что делать, если умных статей почитал, проникся, рисовать в фотошопе что-то умею, css только на уровне 2010 года, html слабовато? Делать уроки? Пилить примеры? Придумывать себе задачи?
Сделай себе сайт, сам нарисуй, сам сверстай, отличая практика, сам таки делал.
Ну и просто ставь какие-то таски, я например хоть и не любитель бессмысленного дроча на пиксели, но хочу попасть на дриббл, так как грят что так водятся реальные работодатели (надеюсь что это так)
>Алсо, что делать, если у меня винда? Чем заменить скетч?
Скоро выходят еще skala project и adobe comet. Не в курсе что у них с поддержкой, но адоби должны по старинке хранить виндоус. Скетч вообще не надобность. Пересел на него только пару месяцев назад, до этого тоже отрисовывал в фотошопе.
Спасибо, идея с круглишком меня уже посетила и я ее вживил, позже покажу финальный вариант.
Ссылка треда: Курс «Типографика и вёрстка»
https://www.dropbox.com/s/ytg1glvm8dkpe0u/etc.pdf?dl=0
https://www.coursera.org/learn/fundamentals-of-graphic-design
Курсера на английском — основы граф. дизайна.
Раньше смотрев даже бесполезные курсы я успокаивал себя тем, что хотя бы учу англицкий, сейчас же мой скилл языка настолько поднялся, что теперь мне кажется будто я проебываю время, гляну немного — если годнота то отпишусь.
Курсера на английском — основы граф. дизайна.
Раньше смотрев даже бесполезные курсы я успокаивал себя тем, что хотя бы учу англицкий, сейчас же мой скилл языка настолько поднялся, что теперь мне кажется будто я проебываю время, гляну немного — если годнота то отпишусь.
ОП, спасибо за всю информацию, которую ты выкладываешь в тред, очень много полезного, особенно про ЮХ и ЮИ.
Прямо-таки кладезь.
С недавнего времени начал заниматься UI под IOS,
осваиваю это дело, с вебом не знаком вообще.
Оцени пожалуйста последнюю работу, хотелось бы получить детальную критику: http://i.imgur.com/Kiohnqj.jpg
Суть приложения (как его видит заказчик) - "UBER для офисов", выбираешь точку на карте,
выбираешь тип офиса, ценовую категорию, количество мест, и параметры времени\даты. После этого приложение находит тебе офис рядом с тем местом, что ты выбрал. Заказчик очень хотел выделить политику 100% денежных возвратов.
Насколько хорошо я справился с задачей? Какие ошибки сделал?
Прямо-таки кладезь.
С недавнего времени начал заниматься UI под IOS,
осваиваю это дело, с вебом не знаком вообще.
Оцени пожалуйста последнюю работу, хотелось бы получить детальную критику: http://i.imgur.com/Kiohnqj.jpg
Суть приложения (как его видит заказчик) - "UBER для офисов", выбираешь точку на карте,
выбираешь тип офиса, ценовую категорию, количество мест, и параметры времени\даты. После этого приложение находит тебе офис рядом с тем местом, что ты выбрал. Заказчик очень хотел выделить политику 100% денежных возвратов.
Насколько хорошо я справился с задачей? Какие ошибки сделал?
Сажа приклеилась. Поднимаю.
Отвечу вечером — в целом ок, но есть грубоватые моменты.
>вот какой в них толк? на дриббле куча такой срани, в вк репосты дриббла с сотней лайков.
Это как высокая мода: ласкает глаз, но носить невозможно. Такие вещи никто не реализует в жизнь на серьезных проектах, потому что — это не работает, не удобно пользоваться, дорого в разработке и т.п.
Не советую забивать портфолио подобным нежизнеспособным шлаком. В серьезных конторах сразу скипают такие резюме, всем интересны только реальные кейсы.
Такое впечатление, что зеленый кружок который летит к корзине, улетает куда-то за экран. Хорошо еще показывать на нем количество вещей в корзине.
Кнопка "Add to card" после помещения в корзину должна показать, что этот товар уже есть в корзине. В идеале ещё дать возможность изменить количество товара положенного в корзину и убрать из корзины не переходя в нее. Ну то есть, скорее всего это будет уже другой ui элемент.
Всё слишком мелко:
- инпут поиска
- нотификация в бургере
- "/hr" в тарифах
- кнопки +\- на втором экране (посмотрел бы я на пользователя попытавшегося нажать на них)
- большая часть наборного текста
Ели верхнее меню типо стандартное системное, то соблюдены отступы, размеры шрифтов и иконок. Если нет, то без претензий, однако, нарушать привычные для пользователя конструкции интерфейса — плохо.
Иконки со стульями на меньших экранах превратятся в месиво из пикселей. Такая детализация излишество.
На втором экране нарисован стул с цифрой пять. Я правильно понял что это счетчик от +\-? Если это так, то надо выделять более явно и отдельно, а не помещать в иконку.
На втором экране идет описание "business class...", короче в этом тексте нет акцентов. Просто какое-то месиво.
На остальные экран почти те же проблемы.
не ОП
Оп продублирую тебе, ответь пожалуйста.
«Поясните за ширину макетов в фотошопе для сайта. Ну вот сделал я 1920 в инвижене проверил, поставил чтобы по ширине браузера ужал, все пиздец мелкое какое-то 14 кегель ели видно. 1200 пх чужой макет поставил там с 12 кеглем все так заебись смотрится. Сколько ширину ставить короче?»
Все зависит от твоего экрана, но подозреваю что у тебя 1440 где-то.
Смотри, ты ужал 1920 на 1440, то есть на 30% грубо говоря, а значит графика и шрифты ужались тоже на 30%. Открываешь чужой макет в 1200 — все ок, потому что экран больше чем макет, вероятно еще полоски сбоку остались.
>666
Ну так на сколько все рисуют. 1200 ставить все таки?
>вероятно еще полоски сбоку остались.
Откуда узнал бля.
Я рисую на 960 сперва, во-первых сейчас много планшетов и это уже ок для них, потом с 960 ты точно понимаешь свой функционал и сетку — как ты будешь ужимать под мобильники, с 960 рисуешь 600 и 340 (кажется) короче под айфон 4.
Потом если есть желание 1280 +
Это чисто мой воркфлоу, знаю типов которые рисуют с мобильных.
Сайт-альма-матер http://www.webdesignrepo.com/
Список визуальных решейний http://www.calltoidea.com/p-claims.php
Учимся печатать десятью пальцами http://www.typingstudy.com/
Процесс интересный для ЮИ http://destroytoday.com/writings/building-the-casper-homepage/
Школа редимага — читаем про шрифты
http://shkola.readymag.com/
Ахуенно. Спасибо большое.
А про first mobile это же дефолт. Ну типо с мобильного легче потом на полный сайт перерисовать.
Да легче, но в некоторых проектах играет как шоры коню, загнанный в 340 пикселей ширины никуда не разбежишься. Если проект не столь требователен к мобильной разработке — начинаю с десктопа.
Спасибо за критику, ребята.
Некоторые замечания очень по делу, сложно со стороны
смотреть на свою работу.
Что касается кнопок +/-, то я взял эти кнопки из IOS9,
правда только после ваших комментариев заметил,
что использовал их не так, как следует.
ОП, единственное что я не понял, это про неформальное общение.
Это плохо или хорошо? По мне так надписи вида "Yeah!" и "Nice!" на кнопках разбавляют общую серьезность.
Тиндеру может и пойдет "еа" "найс" "летс гет ит он", но у вас вроде серьезная тема — тебе решать короче.
Есть емкая и четкая статья поясняющая необходимость вертикального ритма? Сука, мне не верят, и даже переделка макетов со всеми чертежами и пояснениями не помогла.
буду благодарен за толковую статью про вертикальный ритм.
Сколько не читал, смотрел лекций, в реальном проекте ничего годного не получалось.
Вообще у меня у самого с ним адские проблемы, и есть конкретные вопросы, но такие вещи я уже привык делать на глаз.
http://artgorbunov.ru/bb/soviet/20140310/
На английском: Семантическая анимация (!)
http://alistapart.com/article/motion-with-meaning-semantic-animation-in-interface-design
http://alistapart.com/article/motion-with-meaning-semantic-animation-in-interface-design
Неа, он просто же блок редизайнит, а не задротствует про ритм.
Суть просто в том, чтоб не делать на глазок, на самом деле. С точки зрения именно восприятия, можно и на глаз все нормально выставить. Но верстать-то удобнее по циферкам. Если ритм четко определен, то можно вообще все в em делать, и менять просто сменой одной циферки потом. Я накатаю завтра большой пост с примерами.
о, спасибо, буду ждать.
вот например сделано как тут:
http://www.gridlover.net/try
или тут http://typecast.com/gallery/sherlock-holmes-baseline
только текстовую страницу я могу хорошо сделать. но если там есть ещё иллюстрации, вставки более мелкого текста, какие-то спец.блоки/менюшки, не могу понять как расчитывать ритм, какие отступы делать между картинкой и текстами, как располагать тот или иной элемент,не растягивая его до направляющих.
Давайте почоны, приятно знать что я тут не один заинтересован.
А тем временем:
Свг-свгешечки http://svgicons.sparkk.fr/
100 Дней свифта http://samvlu.com/ (тоже думаю выучить потом, сперва джейэс подтянуть)
Выбираем тул для прототипирования: https://medium.com/the-artificial/selecting-the-optimal-prototyping-tool-f60bc49aecf3#.iflaw81ib
Не хочу шитпостить, ОП-чик, но хочу выразить огромную благодарность за то, что выкладываешь весь этот великолепный материал! Добра тебе.
В свифте так все заточено под работу с интерфейсами, пиздец, нищеброды страдают и ябутся с афтером.
Сел писать про вертикальный, клацнув на ссылки, и хуй знает что писать, очевидно же лол, хотя днем минут 10 чет там рассказывал про это ирл, и меня заткнули, а я только разошелся. Наверное, нужно несколько макетов сделать "было/стало".
Ну сам я смотрю чтобы теорию близости не нарушало, 80-100 пикселей между блокам, но если какие-то иллюстрации и прочие радости то дейтствую на глаз.
А ритм? Ну хуй знает, большие иллюстрации всегда сверху, чередование контраста и тд.
В общем не совсем понятно про что там спрашивали, надо конкретные примеры.
http://www.zell-weekeat.com/responsive-typography
Everything I know about responsive web typography with CSS
http://andrew-r.ru/notes/?go=all/how-to-organise-fonts/
Организация шрифтов в проекте
Everything I know about responsive web typography with CSS
http://andrew-r.ru/notes/?go=all/how-to-organise-fonts/
Организация шрифтов в проекте
http://www.smartis.ru/school-1level
Про школу стажеров, детально и дотошно.
Про школу стажеров, детально и дотошно.
Блять, даже ученики все еще верстают фиксированно, ну не пиздец ли это? Мне школа не нравится своим консерватизмом в этом плане, но пойду в нее через год. Поэтому и существует этот тренд, от европейцев хочу перенять их практику — вседоступность и удобсто любых медиумов, от школы научиться управлять проектами и договариваться с клиентами.
http://webdesign.tutsplus.com/tutorials/mastering-alignment-and-distribution-in-sketch--cms-24075
Mastering Alignment and Distribution in Sketch
http://tilda.education/articles-images-for-social
Справочник: размеры картинок для 9 социальных сетей
Mastering Alignment and Distribution in Sketch
http://tilda.education/articles-images-for-social
Справочник: размеры картинок для 9 социальных сетей
Почти годный макет с дриббла, объясняю почему да и почему почти:
+ Хороший акценты
+ Цвет
+ Вместо карусели с пульками нормальный слайдер
+ Эстетичное решение с блоков в центре, иногда картинки действительно не могут растягиваться на фул-видз, однако тут получилось симпатично даже так.
– Меню вверху + бургер = 2 меню
– Два раза The modern way to pay, на первом экране надо было писать что это именно такое
– Уродская кнопка в верхнем правом углу
– Слишком проминентный мокап айфона — надо было с аутлайном сделать.
+ Хороший акценты
+ Цвет
+ Вместо карусели с пульками нормальный слайдер
+ Эстетичное решение с блоков в центре, иногда картинки действительно не могут растягиваться на фул-видз, однако тут получилось симпатично даже так.
– Меню вверху + бургер = 2 меню
– Два раза The modern way to pay, на первом экране надо было писать что это именно такое
– Уродская кнопка в верхнем правом углу
– Слишком проминентный мокап айфона — надо было с аутлайном сделать.
А еще точки в заголовках! –
https://m.signalvnoise.com/the-fidelity-curve-weighing-the-costs-and-benefits-of-interface-design-mockups-b259634807e2#.ka0fjnofi
The Fidelity Curve: How to weigh the costs and benefits of creating UI mockups
The Fidelity Curve: How to weigh the costs and benefits of creating UI mockups
Так нинужны же, неа?
Ды, не нужны, я про нижние в блочках — поэтому и минус
https://www.typewolf.com/assets/7844238711/typewolf_10_best_free_fonts.pdf
Лютая годнота, 10 бесплатных фонтов.
Лютая годнота, 10 бесплатных фонтов.
http://overpassfont.org/
Бесплатный нормальный веб-фонт Оверпасс.
UI решения
http://zurb.com/patterntap
Кто-нибудь может пояснить за управление загрузкой страницы?
Есть вот это http://ilyabirman.ru/projects/emerge/, но оно платное и слишком много на себя берет. Всякие прелоадеры это гониво, ибо просто ждут загрузки всех элементов, а не управляют ей.
Хотелось бы следующий функционал. Добавляем к элементам доп.класс "load_1", "load_2" и т.д. и очередь загрузки идет по порядковым номерам, ну и плюс возможность анимацию прикрутить и кастомно дописать т.е. загрузился "load_1", вылетел слева, загрузился "load_2" вылетел справа, а не все загрузилось, а потом начало вылетать.
Вот ссылка на подборку статей http://usabili.ru/news/2014/06/03/javascript-load-and-execution-order.html (судя по поняше, кто-то местный автор). Я там немного почитал, но ничего не прояснилось. В основном речь идет о загрузки скриптов, использовании всяких упаковщиков и т.п. Меня же интересует загрузка контента. Вот еще http://web-standards.ru/articles/front-end-performance/.
Допустим, страница у нас простая, загрузили jq.js и css-ы просто в head. Затем грузится dom и картинки.
Вот задача грузить так:
1. <div class="load_2"><img src="anon.jpg" class="load_1"/></div>
2. <div class="load_4"><img src="anon.jpg" class="load_3"/></div>
А не:
1. <div class="load_1"><img src="anon.jpg" class="load_4"/></div>
2. <div class="load_2"><img src="anon.jpg" class="load_3"/></div>
Ну или хотя бы сначала див, потом картинку в нем, и только потом следующий див и его картинку. А не сначала весь dom, а потом картинки к нему. Ну или как вариант хотя бы картинки последовательно вот здесь так грузятся http://portfolio.cpeople.ru/portfolio/all.
Вот есть легкий код:
<!-- html -->
<img src="main.png" id="mainImg">
<img src="" data-src="notmain1.png" class="notmain">
<img src="" data-src="notmain2.png" class="notmain">
<img src="" data-src="notmain3.png" class="notmain">
/ javascript /
$("#mainImg").load(function() {
$(".notmain").attr('src', function() {
return $(this).attr("data-src");
});
});
Но это гон какой-то, если таким образом описывать пример выше с cpeople. Вообще, все, что удалось найти - это, либо просто последовательное появление (при условии, что все уже загрузилось), либо какие-то тонны js, где приходится полностью описывать логику загрузки страницы, а не просто классы проставить, например, при условии, что контент на разных страницах будет разный, это гемор дикий, и отдельный скрипт для каждой страницы.
Есть вот это http://ilyabirman.ru/projects/emerge/, но оно платное и слишком много на себя берет. Всякие прелоадеры это гониво, ибо просто ждут загрузки всех элементов, а не управляют ей.
Хотелось бы следующий функционал. Добавляем к элементам доп.класс "load_1", "load_2" и т.д. и очередь загрузки идет по порядковым номерам, ну и плюс возможность анимацию прикрутить и кастомно дописать т.е. загрузился "load_1", вылетел слева, загрузился "load_2" вылетел справа, а не все загрузилось, а потом начало вылетать.
Вот ссылка на подборку статей http://usabili.ru/news/2014/06/03/javascript-load-and-execution-order.html (судя по поняше, кто-то местный автор). Я там немного почитал, но ничего не прояснилось. В основном речь идет о загрузки скриптов, использовании всяких упаковщиков и т.п. Меня же интересует загрузка контента. Вот еще http://web-standards.ru/articles/front-end-performance/.
Допустим, страница у нас простая, загрузили jq.js и css-ы просто в head. Затем грузится dom и картинки.
Вот задача грузить так:
1. <div class="load_2"><img src="anon.jpg" class="load_1"/></div>
2. <div class="load_4"><img src="anon.jpg" class="load_3"/></div>
А не:
1. <div class="load_1"><img src="anon.jpg" class="load_4"/></div>
2. <div class="load_2"><img src="anon.jpg" class="load_3"/></div>
Ну или хотя бы сначала див, потом картинку в нем, и только потом следующий див и его картинку. А не сначала весь dom, а потом картинки к нему. Ну или как вариант хотя бы картинки последовательно вот здесь так грузятся http://portfolio.cpeople.ru/portfolio/all.
Вот есть легкий код:
<!-- html -->
<img src="main.png" id="mainImg">
<img src="" data-src="notmain1.png" class="notmain">
<img src="" data-src="notmain2.png" class="notmain">
<img src="" data-src="notmain3.png" class="notmain">
/ javascript /
$("#mainImg").load(function() {
$(".notmain").attr('src', function() {
return $(this).attr("data-src");
});
});
Но это гон какой-то, если таким образом описывать пример выше с cpeople. Вообще, все, что удалось найти - это, либо просто последовательное появление (при условии, что все уже загрузилось), либо какие-то тонны js, где приходится полностью описывать логику загрузки страницы, а не просто классы проставить, например, при условии, что контент на разных страницах будет разный, это гемор дикий, и отдельный скрипт для каждой страницы.
Это анимация уже загруженных элементов. Речь не об этом. В /пр пересоздал впрочем.
Хочешь поменять ренднер дома? Дом насколько я знаю грузится последовательно и это никак не изменить, если хочешь чтобы что-то загрузилось раньше — ставь раньше в дереве.
Мои знания в этом поверхностны, но курсы с юдасити грят так.
Да, но с жс как раз и можно управлять последовательностью.
Перевожу приведенный код:
Грузим дом обычным способом (в 6 потоков, вроде грузит, т.е. и main.png и notmain1.png и остальные грузятся одновременно), но отображаем notmain1.png и остальные, только когда полностью загрузится main.png.
В /pr подсказали #Control-Flow-Libraries, я погуглили и пока готового решения не нашел, их много всяких, но везде кодить нужно, а не просто классы прописать.
Ну т.е. мы не управляем все равно, но создаем нормальную иллюзию, а не блокируем все прелоадером на всю страницу. В принципе можно и управлять, подгружая одни куски дома по мере загрузки других. Здесь можно вспомнить про lazyload, но, нет, это совсем не то (он вообще говно ебаное, лень писать, в гугле много об этом).
Короче, я поэкспериментировал.
Если мы хотим кастомную анимацию делать (а не как в емердже) - библиотека и не нужна получается, потому что нам нужно завязать на .load только первый экран сайта, все равно анимацию каждый раз прописывать в зависимости от дизайна. А весь остальной контент проявлять только после загрузки последнего элемента первого экрана. Ну это в общем случае, если параллакс, например, с тяжеленными пнгахми, то его так же следует включить в зависимости .load, ибо уебищно выглядит, когда изображение уже летает, а еще не догрузилось. Прелоадер для контента ниже первого экрана смысл будет иметь не всегда (если наша цель повышения няшности), а там где будет пишется отдельно, либо можно прицепить к классу (который дописываем всем необходимым элементам) обычную крутилку, добавлять ее .prepare к элементам, а после загрузки аниируем появление элемента, и .hide на элемент в .prepare.
Вопрос из разряда ux:
как быть с загружаемыми фотографиями? Пользователи могут загрузить от 1 до 5 фотографий разного формата и ориентации, как показать эти фото в карточке? В нынешнем варианте при загрузке одной вертикальной фотки остается пустое место.
Обрезать все фото до квадрата и вставлять только первую фотку? Скучно. А мелкие миниатюры слишком мелкие будут.
как быть с загружаемыми фотографиями? Пользователи могут загрузить от 1 до 5 фотографий разного формата и ориентации, как показать эти фото в карточке? В нынешнем варианте при загрузке одной вертикальной фотки остается пустое место.
Обрезать все фото до квадрата и вставлять только первую фотку? Скучно. А мелкие миниатюры слишком мелкие будут.
Тут и при загрузке одной горизонтальной с иными соотношениями сторон пустота будет.
Одну в квадрат кропить, веселись на ховерах.
Спасибо, буду думать
Изи. Собираешь все лоады в массив. Проходишь по массиву. Вешает на онлоад картинки появление и так до конца. Так делают уже лет 5. То что у бирмана можно написать за 30 минут. На чистом жс чуть больше. Фронт–ендер в треде. Все в машину. Все вот эти ваши анимации красивые разбиваются в пизду когда, ебучим дизайнерам, на ебучих старых телефонах, показываешь как это все тормозит. Это актуально для компутеров или айфонов 5-6 и новых андроидов.
Да хуй так кто делает. Все просто прелоадер на всю страницу кидают, максимум отдельно еще на тяжелый внешний контент (на какой-нибудь парсинг обычно). Если тонкостями загрузки и замарачиваются то только на часть разработчика (скрипты там грузят хитро и т.п.), на внешний вид клали.
Насчет тормозов. Да, есть такая хуйня. У меня главная идея была в том, чтоб страницу не колбасило, а не просто свистелок навести, наличие тормозов зависит уже от конкретного решения (когда слишком дохуя чего анимируется - тормозит), например на приклейтед тормозов не будет. И плавность анимации здесь не кретична даже, просто структурированный порядок загрузки.
Я разбирался когда, понял, что, например, на готовую тему вордпресса я не смогу прикрутить эту структурированную загрузку (именно это было целью в начале), нужно все это продумывать одновременно с версткой и верстка должна быть очень индивидуальная (я уже давно ничего не верстаю,а собираю из готового, в случае с этой загрузкой так не получится), реально принимо короче на лендосах только и для личных сайтов дизайнеров под выебон на awwwards.
Примитивный скрипт (смените путь бутсрап.жс):
http://pastebin.com/DfAvbK23
Алсо, все это актуально для внутренних переходов по сайту с применением аякса для загрузки страниц. Внешний переход на главную - здесь все это будет немного кастрировано.
Конечно это никому не нужно, ведь ты либо грузишь картинки подряд либо ты их с жыеса как хочешь подсовываешь и куда угодно кидают. Так делают в SPA. На простых сайтиках такого нет.
То что ты описал это вообще пушка.
Вешает в начале страницы див с красной полоской. Жыесом считаешь контент который нужно загрузить и делишь 100 / количество контента. Это число и есть процент на который увеличивается стрелка красная после загрузки каждой картинки например. Когда 100%, прячем все, и показываем готовую картинку.
Скрипты в шапке гавно. Стили в принципе тоже можно подгрузить позже, после основного экрана, как и шрифты.
Может я не понятно объясняю, но это делается все очень легко, и не понятно что ты мудришь.
С новомодными фрейморками типа реакта можно вообще не напрягаться по поводу аякса. Загрузил в локалсторедж текст, и оттуда его берешь да и отрисовываешь.
Почитать и потыкать у себя может тут.
http://themeshaper.com/2015/05/07/theming-with-the-rest-api-meet-picard/
На очень быстрых интернетах даже прокатывает такой трюк:
1) нажимаем на ссылку, вся страница фейдаут делает.
2) при загрузке новой страницы фейдин.
И пользователи думают что работает все без перезагрузки и очень быстро.
1) нажимаем на ссылку, вся страница фейдаут делает.
2) при загрузке новой страницы фейдин.
И пользователи думают что работает все без перезагрузки и очень быстро.
Если все так просто - покажи хоть один сайт.
Страницу в вакууме сделать легко, на реальном сайте адский гемор - все верстать с нуля и переписывать всю навигацию под аякс.
Красная полоса прелоадер на время дом и скриптов, дальше белые блоки раздвигаются, пока картинка под ним грузится, и т.д. Основная идея - использование элементов дизайн страницы как индикатор загрузки.
Вот http://ony.ru/yarky?prev_work_id=37 (нужно ткнуть по картинки внизу "следующий проект") это не отражает суть того, что я пытаюсь донести, но показывает почему прелоадеинг и аякс это няшно.
>Вот http://ony.ru/yarky?prev_work_id=37 (нужно ткнуть по картинки внизу "следующий проект") это не отражает суть того, что я пытаюсь донести, но показывает почему прелоадеинг и аякс это няшно.
Че-то у меня дико глючит в хроме, будто сайт умирает на пару секунд.
Что именно происходит? Там вроде и глючить-то нечему.
Нет, оп не умер и не ушел в цифровое пространство – оп был на каникулах с тян. А теперь снова погнали.
Передряги при переносах (по-русски)
http://css-live.ru/articles/peredryagi-pri-perenosax.html
Сегодня начался
HTML, CSS, and Javascript for Web Developers
https://www.coursera.org/learn/html-css-javascript-for-web-developers
Пикрелейтед с поездки
Передряги при переносах (по-русски)
http://css-live.ru/articles/peredryagi-pri-perenosax.html
Сегодня начался
HTML, CSS, and Javascript for Web Developers
https://www.coursera.org/learn/html-css-javascript-for-web-developers
Пикрелейтед с поездки
Новый плагин от инвижон с риал дейта.
http://labs.invisionapp.com/craft
Разбор его же
https://www.youtube.com/watch?v=qI8QxFO_AEg
http://labs.invisionapp.com/craft
Разбор его же
https://www.youtube.com/watch?v=qI8QxFO_AEg
Классные кнопки на чистом сиэсэс
http://codepen.io/tmrDevelops/pen/VeRvKX?editors=1100
A MEANINGFUL WEB TYPOGRAPHY STARTER KIT
http://matejlatin.github.io/Gutenberg/
Эффективное использование ARIA в HTML5
http://prgssr.ru/development/ispolzovanie-aria-v-html5.html
http://codepen.io/tmrDevelops/pen/VeRvKX?editors=1100
A MEANINGFUL WEB TYPOGRAPHY STARTER KIT
http://matejlatin.github.io/Gutenberg/
Эффективное использование ARIA в HTML5
http://prgssr.ru/development/ispolzovanie-aria-v-html5.html
http://video.kzncv.ru/
Видео лекции от русских студий.
Видео лекции от русских студий.
Больше годных видео, так же есть сменить на .нет, то будет английские — просто охуенно.
https://uideo.ru
На пике редизайнул секцию с http://bee7.com/news/
https://uideo.ru
На пике редизайнул секцию с http://bee7.com/news/
Новый прототул в бете
http://silverflows.com/
Его же разбор
https://medium.com/sketch-app-sources/ready-to-prototype-from-within-sketch-then-say-hello-to-silver-a9e68b0ce3db#.us9pa37wu
The Difference Between Anchors, Inputs and Buttons
https://davidwalsh.name/html5-buttons
http://silverflows.com/
Его же разбор
https://medium.com/sketch-app-sources/ready-to-prototype-from-within-sketch-then-say-hello-to-silver-a9e68b0ce3db#.us9pa37wu
The Difference Between Anchors, Inputs and Buttons
https://davidwalsh.name/html5-buttons
А кто-нибудь работает тут в паре или команде?
Можно ли работать вдвоем или в этом нет смысла? А то у меня тут проект один, где мне не хватает знаний, думаю, не поискать ли мне напарника.
Можно ли работать вдвоем или в этом нет смысла? А то у меня тут проект один, где мне не хватает знаний, думаю, не поискать ли мне напарника.
>А кто-нибудь работает тут в паре или команде?
Работаю на пару с двумя разработчиками, один фронт другой бекенд. Кого ищешь?
Да я пока не знаю, ищу ли. Делаю почти за спасибо один сайт (сам проект не коммерческий, поэтому денег хз сколько. отчасти поэтому активно не ищу пока, сам понимаю, что бесплатно никто качественно работать не согласится), думал там просто перерисовать дизайн надо будет, а оказалось появился новый функционал, новая концепция.
Там сейчас есть фронтенд и бэкэнд, нужно продумать интерфейс и в идеале какой-то визуальный язык/бренд.
Сам сервис состоит из сайта и приложений на всех платформах.
В общем я пришел туда почти случайно и сейчас понимаю, что знаний в юх у меня мало для такой темы. Вот и набираюсь их активно тут в том числе.
https://design.tutsplus.com/courses/mastering-light-shadow-in-adobe-photoshop/lessons/shadow-physics
Как делать нормальные тени в фотошопе. Бесплатно, на английском.
Как делать нормальные тени в фотошопе. Бесплатно, на английском.
Первая попытка, лол
Лучше lens blur юзай, а не это сраное замыливание
Спасибо, попробую.
Как «Яндекс» создает интерфейсы
http://www.blog.jazov.com/uiux-design/kak-yandeks-sozdaet-dostupnye-interfejsy.html
Еще тема - tilt-shift blur, получается постепенное замыливание
Подписался на этот тред.
Велком.
Единицы измерения шрифта или «Как сделать шрифт нужного размера?»
https://designpub.ru/%D0%B5%D0%B4%D0%B8%D0%BD%D0%B8%D1%86%D1%8B-%D0%B8%D0%B7%D0%BC%D0%B5%D1%80%D0%B5%D0%BD%D0%B8%D1%8F-%D1%88%D1%80%D0%B8%D1%84%D1%82%D0%B0-%D0%B8%D0%BB%D0%B8-%D0%BA%D0%B0%D0%BA-%D1%81%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C-%D1%88%D1%80%D0%B8%D1%84%D1%82-%D0%BD%D1%83%D0%B6%D0%BD%D0%BE%D0%B3%D0%BE-%D1%80%D0%B0%D0%B7%D0%BC%D0%B5%D1%80%D0%B0-2ce75af646ed#.750dt22wm
Гит + скетч = форкнул пиксели и закоммитил новый бордер-радиус! LGTM
https://github.com/mathieudutour/git-sketch-plugin
Type systems in Sketch
http://get.invisionapp.com/chapter-4-of-10-design-workflow-with-sketch
Вчера ходил на интервьюху в большую компанию, занимается in-app рекламой, на позицию UX/UI в общем кажется я им понравился, но думаю их смутила моя парт-тайм учебка. Сказали в конце недели скажут результат, делал тестовое.
https://github.com/mathieudutour/git-sketch-plugin
Type systems in Sketch
http://get.invisionapp.com/chapter-4-of-10-design-workflow-with-sketch
Вчера ходил на интервьюху в большую компанию, занимается in-app рекламой, на позицию UX/UI в общем кажется я им понравился, но думаю их смутила моя парт-тайм учебка. Сказали в конце недели скажут результат, делал тестовое.
Классная лекция по веб-типографике, но очень абстрактная. На англицком.
Tim Brown | Universal Typography
https://www.youtube.com/watch?v=0OF-jU97HzQ
Tim Brown | Universal Typography
https://www.youtube.com/watch?v=0OF-jU97HzQ
Designing A Product Page Layout with Flexbox
https://css-tricks.com/designing-a-product-page-layout-with-flexbox
https://css-tricks.com/designing-a-product-page-layout-with-flexbox
Классный свг кнопки на фейл\саксесс.
http://lmgonzalves.github.io/loading-buttons/
http://lmgonzalves.github.io/loading-buttons/
Первоосновы проектирования взаимодействия
http://ashapiro.ru/translations/tog-first-principles/
Пикрил на тестовое задание, увидел ошибку только сейчас, лол.
http://ashapiro.ru/translations/tog-first-principles/
Пикрил на тестовое задание, увидел ошибку только сейчас, лол.
Что за тестовое задание? Куда пробуешься устроиться?
На удаленку, к слову, в студию не взяли, говорят нужен синиор дизайнер, и послали меня к хуям, такие дела, разочарование.
Сеньора и еще на удалёнку? Ты в студию Л пытался что-ли?
Не, это было две разных вакансии, сеньора искали в студию это
А на удаленку
Здесь можно посмотреть процесс http://rs-carshare-app-research.webflow.io/
Собственно я малец, только 21, короче буду пилить дальше фриланс походу.
Да нафиг тебе этот фриланс всрался? Я тоже в свое время мечтал о "сидишь дома, зарабатываешь 1000к зеленью в месяц". Сейчас сижу на 9-ти часовом рабочем дне и нормально.
Говорю же — не берут никуда.
Только не надо опускать руки, как я в своё время. По себе сужу, конечно же, но вход в "профессию" непростой. В итоге, после нескольких попыток, стажировок и бессонных ночей я таки стал дизайнером. Хотя еще много чему научиться нужно.
Вообще, ОП, в правильном направлении двигаешься. Я тоже со временем, не сразу, понял, что одним лишь ФШ не живёт дизайнер. "Люстра", АЕ, и многие другие инструменты тоже пригодятся в работе, и это я не говорю о навыках вёрстки. Короче, по-возможности, буду кидать сюда тоже интересные вещи.
Изображение открепилось.
Расскажите, если опытные уже, как обойти все подводные камни и не биться лбом, а сразу идти правильным путем?
Вот если у меня уже есть в работе проект и мне его нужно сделать охуенным. Что брать в пример, что читать? Только без этих размазанных мыслей о "думайте о пользователях"
Спасибо, руки опускать не собираюсь — такой уж путь самурая.
Спасибо и тебе.
>Расскажите, если опытные уже, как обойти все подводные камни и не биться лбом, а сразу идти правильным путем?
Опыт, интуиция, тренды.
Два поста написал я.
Хотелось бы тебя послать, да вот сам такой же был. Как раз о пользователях думать и нужно. Сделать так, чтобы им удобно было, чтобы захотелось вернуться. Я пользуюсь принципом "как для себя". Если удобно мне, то тогда уже тестирую на коллегах или желающих. Иногда прибегаем к А-Б тестам. А вообще, опыт, тут только опыт. Иногда проб и ошибок, иногда чужой. Поэтому посещай тренинги, мастер-классы. Что читать? Интернет полон советами для новичков, а если ты уже более-менее опытный, и давно в професии, то здесь у тебе поможет только твое критическое мышление. Как делю я — сначала все по максимуму, потом убираю лишнее. Это при условии, что на стадии проектирования ты ответственно к этому этапу подошёл.
SVG в вебе: Практическое руководство
https://svgontheweb.com/ru/
https://svgontheweb.com/ru/
Сходу не совсем понятно, в чем назначение этого приложения. Да и тыкать пальцами по таким маленьким иконкам будет непросто. Я бы заменил текст с "уппппс, у вас нет машин" на "пора добавить вашу первую машину" и кнопка "добавить" или "добавить сейчас".
Да, есть что поменять, но пора сегодня было уже сдавать, так что отправил письмо. Собственно получились вот такие три UI на одном и том же UX.
Оформление мне на втором нравится, расположение кнопок на третьем (кроме не понятной черной полосы)
>нравится, расположение кнопок на третьем (кроме не понятной черной полосы)
Ну это же это, андроид, разве не должно быть так?
А, загулил, надо было ее просто в тон потемнее сделать — буду знать.
По первому макету я уже сказал выше. По второму вообще не ясно, что делать. Если в первом был какой-то призыв к действию (кнопка по центру), то здесь ничего этого нет. Просто информация о том, что поездок в учётной записи нет. Третий макет — что делает кнопка «добавить»? Добавляет новую поездку или размещает новый заказ для пассажиров? Кстати, вместо изображения можно было бы изобразить карту, или текущее местонахождение (если в поездке).
Разумеется, все вышесказанное лишь мое ИМХО.
Cпасибо, я твою идею понял, возможно переделаю если выпадет время, к слову пришел ответ — в четверг интервью в скайпе.
Тем временем не успеваю все прочитать поэтому вывалю немного тут:
https://ia.net/know-how/responsive-typography-the-basics
https://robinrendle.com/essays/new-web-typography/
https://www.xfive.co/blog/stop-supporting-ie10-ie9-ie8/
https://medium.com/sketch-app-sources/the-sketch-shortcuts-you-didn-t-know-about-910af95c75ed#.kz5wy9ctu
GL&HF, я тоже как-то раз проходил собеседование по скайпу, посоветую перед ответом держать паузу секунду-две, вдруг собеседнику захочется что-то добавить, а тут ты такой начинаешь отвечать, потом вы оба извиняетесь, пару секунд пытаетесь определить, кому же говорить первым, ну и так далее.
За ссылочки отедльное спасибо. Есть что по техдизайну? Например, уроки по рисованию качественных иконок, кнопочек, чтобы аж «бохато» было. Мне надо повысить свой уровень визуального дизайна, решил обратиться к техдизу. Пока что, есть http://techdesigner.ru/blogs/category-14/
Я заебался ебашить конкурсы, сидишь хуяришь по 30 часов, а потом заказчик даже не удосуживается фидбэк оставить.
Неблагодарная работа.
Единственный плюс в том, что получаются неплохие кейсы для портфолио. Думаю оформить их попижже и залить на беханс.
Хоть какую-то пользу извлеку.
Неблагодарная работа.
Единственный плюс в том, что получаются неплохие кейсы для портфолио. Думаю оформить их попижже и залить на беханс.
Хоть какую-то пользу извлеку.
Прошёл через такую же фигню. Но тут к твоей работе у меня тоже есть пару вопросов.
>За ссылочки отедльное спасибо. Есть что по техдизайну? Например, уроки по рисованию качественных иконок, кнопочек, чтобы аж «бохато» было. Мне надо повысить свой уровень визуального дизайна, решил обратиться к техдизу. Пока что, есть http://techdesigner.ru/blogs/category-14/
Зацени http://www.lynda.com/Illustrator-tutorials/Technical-Illustration-Creating-Cutaway/152430-2.html
Вот кусок на ютубе https://www.youtube.com/watch?v=Y4FyHo72zJo
Это то?
Кстати, на рутреке есть слитый.
Буду рад услышать критику, критики тоже не хватает.
Вот за что я НЕ люблю Dribble, так это за неприспособленность выкладываемых работ к реальным условиям. Дизайнеры не продумывают ситуаций наперёд. Как будет выглядеть надпись продукта в две строки. А если у меня имя не Logan, а Constantine? Почему вместо нормального описания Lorem Ipsum? Почему в комментариях у всех аватарки — что если пользователь анонимно написал коментарий? Цена в $620 сильно теряется на фоне, по сравнению с кнопкой и описанием. Я лишь при втором прочетнии обратил внимание на неё. В корзине есть состояние 2 из 5, а это что может означать? Внизу есть карточки похожего товара, почему именно внизу? Лучше поднять наверх, дабы показать пользователю, что это не все, что есть на сайте.
Внешний визуальный дизайн очень хорош. Все чистенько, красивенько и приятно смотрится. На практике, это не будет работать, реальный контент будет ломать всю структуру, а страница с данным расположением блоков не будет продоавать в полной мере. Пользователи попросту потеряются на ней.
>Внешний визуальный дизайн очень хорош. Все чистенько, красивенько и приятно смотрится. На практике, это не будет работать, реальный контент будет ломать всю структуру, а страница с данным расположением блоков не будет продоавать в полной мере. Пользователи попросту потеряются на ней.
Че думаешь без тебя не знаем? Просто любуемся визуалкой.
Я так и написал, что визуальная часть очень хороша.
Ну запили свой воркфлоу. Что юзаешь для сборки? Как деплоишь? Чо куда почём?
Продакшн верстку пока не делаю, работаю с двумя ребятами — это их дело, но:
Бумага ⟶ Скетч ⟶ Jade (+emmet) + Sass (+bourbon) ⟶ Grunt
Собираю у себя локально, после оплаты перетаскиваю клиенту. Дизайню c шрифтами Гугл фонтс, сетку делаю свою на флексе (гибче любой фреймворк-сетки). В самом конце Кибердак. Типа такого.
Тем временем пару ссылок из жж Штанга:
1. Наглядное руководство по мобильной типографике от словолитни Hoefler&Co.
http://discover.typography.com/theme/made-for-mobile/
2. Американская студия oBanquinho рассказывает о редизайне журнала Real Simple.
http://www.thetinybank.com/realsimple
ВНЕЗАПНО нашел вакансию дизайнера мобильных приложений в своей Мухосрани.
Прислали тестовое задание, посмотрю что дальше будет.
Буду держать вас в курсе Знаю что всем похуй, просто не с кем поделиться
Прислали тестовое задание, посмотрю что дальше будет.
Буду держать вас в курсе Знаю что всем похуй, просто не с кем поделиться
Ну давай там, успехов, если че насоветуем.
Я мониторю твою тему, но желаю тебе удачи.
Акция: Покупаешь флинто — скетч в подарок.
https://www.flinto.com/sketch_deal
https://www.flinto.com/sketch_deal
Анонии, а какой адекватный срок на разработку дизайна приложения/сайта? Допустим, взять небольшой интернет-магазин? Сколько на страницу времени у вас уходит?
На интернет-магазин время по разному рассчитывается. Но, обычно не менее 2-3 месяцев. Есть проект, который больше года длится.
1 страница (4к-5к пикселей) — день. Это в идеале, на практике — 2.
Не понимаю, как ты страницы в пикселях считаешь и соотносишь со временем, но по опыту скажу, что даже на разработку страницы в 320х640 может уйти до нескольких дней.
Почем 100 пикселей под IOS?
Верно, не спорю — я же навскидку про интернет-магазин.
Айос отдельная пушка, пока ничего не делал на заказ нейтив-мобильного.
Разработка магазина это отдельная и довольно сложная штука. Кстати, разрабатывать магазины интересно лишь в первые несколько раз, потом начинается одинаковая рутина — улучшение, продвижение, UX-стратегии, и прочее. Часто и маркетологи подключаются, правда, частенько с нереальными идеями, типа, поставить видеорекламу вместо карточки товара.
Согласен, принцип работы везде один и тот же, если бы мне заказали интернет-магазин, я бы взял дизайн студии и перерисовал под свои нужды. Быстро, дешево и охуенно.
>дизайн студии
Студии Лебедева конечно, у бюрошников же не было интернет магазина? Хотя гетвеар бы потянул, но там немного другая идея, но есть что тоже потырить.
https://www.codeschool.com/courses
Cегодня бесплатный уроки, до воскресенья американского. Есть интересный штуки про фронут, гиту, свифту.
Cегодня бесплатный уроки, до воскресенья американского. Есть интересный штуки про фронут, гиту, свифту.
Когда можно отказаться от разрядки прописных
http://bvz.name/blog/all/kogda-mozhno-otkazatsya-ot-razryadki-propisnyh/
http://bvz.name/blog/all/kogda-mozhno-otkazatsya-ot-razryadki-propisnyh/
>бесплатный уроки
А где на этом сайте увидеть Все курсы, чому я вижу только free?
Блин, а у него классные работы!
Поцаны, а вы ссылки то подчеркиваете еще?
Зачем? На дворе 2016
Не знаю, не везде так очевидно. Тем более с тача даже ховер не работает.
Графический интерфейс
Эмоция в форме, сообщение в ясной системе.
Хороший рид из Яндекса.
https://medium.com/@kovchiy/70bb2d0d58be#.3tiv1axxs
Эмоция в форме, сообщение в ясной системе.
Хороший рид из Яндекса.
https://medium.com/@kovchiy/70bb2d0d58be#.3tiv1axxs
Меня взяли. Джуниором. Буду на подхвате + вести колонку (не зря последнюю неделю смотрю лекции Ильяхова).
Как у тебя дела?
Посоны, норм?
Ну хз, грязновато
А какое задание то? И какие требования/умения нужны. Я за тредом не следил особо, не пойму все ваши концепты вроде этого они рабочие?
Охуенно. Буду переделывать заново.
Мое задание было вот
Тебе только спроектировать нужно было интерфейс? Без всякой реализации?
Да.
Чисто-хуизно, впечатление все равно плохое.
С таких исходников вообще не нужно обтравливать.
Других не было.
Спасибо за поддержку, господа.
Тестовое задание мне прислали в пятницу,
сделал я его к обеду субботы и сразу отправил.
Теперь жду когда кончатся выходные, чтобы мне наконец ответили.
Поэтому как будут новости - сразу отпишу вам.
Не хотелось бы озвучивать задание конкретно, но в общих чертах содержание задания такое: сделайте 2-3 экрана приложения, которое служит тому то и тому то. Короче говоря решает какие-то потребительские проблемы.
Задание нифига не легкое, я убил на него часов 10, переделывал два экрана четыре раза.
Думаю как раз в этом моя главная проблема.
Всегда всё вылизываю до тех пор, пока глазу не за что будет зацепиться.
КПД не очень хороший.
Фух, работка поперло. В общем пришли люди с хуевым готовым приложением, но работающем, сначала меня вроде как поставили на подмогу, но решили отдать мне проведение UX-ресерча, а такой опыт у них впервые, даже подсмотреть из старых проектов никак — их делали с нуля. В обще м, потею тут. Еще надо айфон 6 покупать, но так не хочется, но надо, в долгой перспективе.
Короче немного материала:
Typesetting in Sketch
https://medium.com/@sketchapp/typesetting-in-sketch-dc870fc334fc#.dp0jr7qxp
Organising Sketch for iOS
https://medium.com/sketch-app/organizing-sketch-3-for-ios-ebb97cae58b7#.15vjn7roe
Айдентика сенсума (обожаю пересматривать)
http://artgorbunov.ru/projects/sensum-identity/
Тафти был бы рад горд:
Learning to See: Visual Inspirations and Data Visualization
https://medium.com/accurat-studio/learning-to-see-visual-inspirations-and-data-visualization-ce9107349a#.h6xr7pjz0
Короче немного материала:
Typesetting in Sketch
https://medium.com/@sketchapp/typesetting-in-sketch-dc870fc334fc#.dp0jr7qxp
Organising Sketch for iOS
https://medium.com/sketch-app/organizing-sketch-3-for-ios-ebb97cae58b7#.15vjn7roe
Айдентика сенсума (обожаю пересматривать)
http://artgorbunov.ru/projects/sensum-identity/
Тафти был бы рад горд:
Learning to See: Visual Inspirations and Data Visualization
https://medium.com/accurat-studio/learning-to-see-visual-inspirations-and-data-visualization-ce9107349a#.h6xr7pjz0
С UX-исследованиями это понятно, штука интересная. Но шестое Яблоко зачем?
А как эти ux-исследования выглядят? А то может я это могу и это вообще просто, но название страшное.
Еще такой вопрос: я недавно занялся самообучением в интерфейсах и вебе в целом, но люди, которым я помогаю сейчас не воспринимают мои решения и советы, хотя они объективно ценные и правильные. Например, я офигел от того, что на старом сайте, который сейчас редизайнится, не была установлена яндекс-метрика. Я говорил им пособирать статистику хотя бы месяц-два, пока новый дизайн в работе. Пропустили все мимо ушей, решения принимают на свое усмотрение. Типа что им кажется важным, то важно и пользователям (один чувак фанатеет от своих алгоритмов фильтрации, поэтому НУЖНО сделать очень подробный фильтр)
Фильтры это всегда хорошо, чем их больше - тем лучше, если вес работает. Не забудь блеснуть знаниями и сказать, чтоб они страницы фильтров от индексации закрыли (судя по всему там не очень в сео, раз метрики всякие нинужны).
Ну там просто некоторые вещи явно сделаны "для себя", а не для пользователей. Я немного со стороны на это смотрю, поэтому могу с уверенностью сказать, что некоторые вещи можно спрятать, например, от среднего пользователя, а некоторые упростить.
Но меня взяли, когда я был совсем лохом, теперь не знаю, как свой авторитет поднять. Только пилить альтернативную версию и сравнивать живые цифры, но это же фантастика. Я ведь для всех "рисовальщик".
Вся студия рисует на них макеты, клиентам презентует тоже, я бы рисовал на 4, но скейл неудобный и нихуя не видно, короче такие дела.
Прокачивайся и уходи в другое место.
>А как эти ux-исследования выглядят?
Скачал приложение, выявляешь все косяки, предлагаешь решения, рисуешь новый UX — заворачиваешь в документацию
Очень спорное утверждение.
Тред не читал, простите если тема избита. Так вот.
Что посоветуете новичку для освоения Single Page Application?
Новичок знает про HTML+CSS, JS, AJAX, jQuery, LESS, сборка на Grunt (Gulp).
Но новичок не знает с какой стороны подойти к SPA. Разве что я так понял надо выбрать между React и Angular.
Ну ладно, выберу. Но перед тем хотелось бы статей "как написать SPA с нуля на чистом JS", чтобы понять механику. Прежде чем браться за Ангулар иди Реакт.
Спасибо что дочитали до конца.
100 макетов в PSD для прокачки навыка версталы.
https://vk.com/wall-38368309_28103
https://vk.com/wall-38368309_28103
Почему у Бюро в вебе такие работы, как будто они застряли в 2000-х? Вроде где-то и тени проскакивают длинные и верстка бывает интересная, но цветовые палитры, шрифты, приемчики, этот юморок надоевший (когда с пользователем "общаются" по-простому, по-свойски) — все как будто замерло и не развивается.
А что ты предлагаешь?
Ебашить глоу на кнопки, делать выносные элементы аля пикрилейтед?
Тренды проходят, если раньше лонг шэдоу считался за интересный прием, то сейчас уже совсем некомильфо.
Простой, чистый, понятный флет-дизайн всегда будет цениться.
Надо пытаться повышать уровень своих работ за счет типографики, верстки, четкого и продуманного макета, продумывать юзер экспириенс.
А глоу покрутить всегда успеешь.
ну и где тут вебдизайн? программисты мышкой обсуждают оформление. пффф. дизайнеры мля)))
Иди экшены для фотошопа качай, мань.
не проiцiруй. смотрите что обсуждают дизайнеры: http://www.webdesignernews.com/
а не рюшечки-тенюшечки как тут.
жаваскрипт хоть знаете, м? вебдизайнеры блять)))
>It's No Joke...GraphicStock is Giving Away 7 Days of Free Downloads to over 300,000 Graphics and Images [ad]
>Cпорит со мной
>Cпрашивает знаю ли я джаваскрипт — а ведь я знаю.
И сейчас ты нам расскажешь, что есть НАСТОЯЩИЙ ВЕБ-ДИЗАЙН, так ведь?
>graphic or visual design skills
Как сделать такой градиент?
mesh, grain
Ошибся тредом, хотел в тред вопросов запостить.
Как в фш сделать?
Не знаю, нахуячь цвета размажь пальцем, заблюрь, загрейни.
кисточкой. Или ты живешь в мире, где в фотошопе только фильтры и стили?
Можно ткнуть три раза жесткой кистью, размыть все по гауссу и наложить нойз. В фотошопе же безграничные возможности
Ну я примерно так и сделал.
Нарисовал квадратики и кружочки, гаусса накинул и нойза.
Бампую сегодняшней работой. Делаю на тимфорест, кто-нибудь вообще занимался этим тут? Как там с фотками и со шрифтами? Ожидаю анальной модерации, но что ж поделать.
Кстати там открылся раздел с файлами скетча, поэтому закину и туда тоже.
Кстати там открылся раздел с файлами скетча, поэтому закину и туда тоже.
Шрифт меню не очень, оставь его для цитаты повара. Почему фамилия повара В О Т Т А К ?
Фотку большую сделай меньше, тебе ведь нужно заманить посетителей богатым выбором меню или ценами, не заставляй скроллить
Короче ты не подумал о юзабилити совсем мен.
Белого места слишком много снизу
Оки. Принял к сведению.
Юзабилити ты наш, это еще не конец же ; )
Зачем выкладываешь тогда?
Доделывай и возвращайся
>Зачем выкладываешь тогда?
>Делаю на тимфорест, кто-нибудь вообще занимался этим тут? Как там с фотками и со шрифтами?
Сука, уже даже в собственном треде на меня наезжают.
Знаю немного html, css. Позже учил яву, за 2 месяца дальше массивов и объектов не зашел. Хочу вкатиться в юи. Рисовать не умею, пока учусь по одной книге. Что и как делать, есть смысл с такими никчемными скиллами.
Качать иллюстратор, находить уроки? Что-то книг невидно по инструментам.
Смотря куда метишь, если в вебдиз, качай дальше фронтенд, и рисуй по макету раз в два дня.
Можешь почитать тред, тут полно полезняшек.
ребята, а подскажите, что такого почитать, чтобы понять, как делать макеты интереснее визуально?
не сетки там, композицию и типографику, с этим я разобрался, а вот именно про визуальную часть, чтобы в одном месте было собрано именно про графику - формы, орнаменты, тенюшки с бликами, какая-нибудь вот такая (как на пикриле) поеботина
а то с версткой и всяким таким я более-менее разобрался, до хуя по этому всему прочитал книг, теперь хочется визуальной красоты навести, чтобы ебашить хорошие графические концепты, а чё-то ничего по теме найти не могу
не сетки там, композицию и типографику, с этим я разобрался, а вот именно про визуальную часть, чтобы в одном месте было собрано именно про графику - формы, орнаменты, тенюшки с бликами, какая-нибудь вот такая (как на пикриле) поеботина
а то с версткой и всяким таким я более-менее разобрался, до хуя по этому всему прочитал книг, теперь хочется визуальной красоты навести, чтобы ебашить хорошие графические концепты, а чё-то ничего по теме найти не могу
два раза написал про разобрался, не перечитал перед отправкой -_-
По тенюшкам книг особо нет — смотри и повторяй чужие работы.
Удваиваю вопрос. Я вот пизжу градиенты и тенюшки у Лебедева.
И правильно делаешь.
Не к слову, но чюваки тут запустили блог о framer.js на русском! Просто ништяк, надеюсь будут его поддерживать.
http://learnframer.ru/
меня не столько тенюшки интересуют, сколько в целом некоторая YOBA-вость графики.
я лет семь назад с одногруппниками видел книгу такую - там расписывалось, как в фотошопе мутить всякие такие эффекты типа пикрила. при этом не сказать, что тут что-то прям сложное, в крайнем случае всегда можно найти туториал в инете, но там целая книга такого и всё РАЗНОЕ.
но мне тогда похуй было на дизайн, т. к. по образованию я не дизайнер, и я не запомнил ни автора, ни названия
О, продаю похожий фон на стоке:3
Я в принципе понимаю, что фронтэнд более реалистичен, чем какая-нибудь андроид разработка. Но я так понимаю, что отдельно дизайн в иллюстраторе без кода никому не нужен.
Хорошо, анон, не злись, поясни за порог вхождения или необходимые навыки, чтоб хотя б копейку какую осилить.
Напишу мини-кулстори. Года полтора назад верстал, учился, было интересно. Пока я не прочитал на вики "Как установить вордпресс за 5 минут". Кому нужны мои поделия, если так просто выбрать любую тему, настроить всё и т.д.
Да я не злюсь, чего мне на тебя злиться?
> поясни за порог вхождения
Пороги вхождения сейчас высоки, очень, что в веб-диз, так и в веб-разрабоку, если раньше джуниором брали с малейшими навыками джейэс, то теперь если не умеешь галпом собрать продакшн — хуй тебе на палочке (это выжимка из того что я читаю и наслышан, сам то я всего год+ в индустрии).
> необходимые навыки
Писать нормально, обрабатывать информацию, быстро осваивать новые тулы, не тупить, уметь верстать, работать в команде, капельку воображения. Говорить по-английски и читать документацию — это самое важное наверное.
>копейку какую осилить
Ты про деньги?
Свои первые я заработал на гоудизайнере после 4 месяцев рисования макетов, 17 000 рублей было кажется. Больше туда не суюсь.
>кому нужны мои поделия, если так просто выбрать любую тему, настроить всё и т.д.
Говно-бизнесу нужны говно-шаблоны, да и не сделаешь на все шаблон. Иначе бы уже все изшаблонили в мире. Те кто их покупают — не твоя аудитория, и радуйся что они 500 рублей потратили на шаблон, а не ебали тебе мозговую ткань со своими правками.
Сейчас такое время что надо действительно уметь что-то, ну можно конечно на воркзилле по 300 рублей делать лендинги, но для меня это не работа. Думаю начать нормально зарабатывать надо примерно 2 года, меня вот недавно взяли на работку, зп так себе, разослал еще писем на подработку, надеюсь недавние клиенты с сайд-проджектов подкинут что-нибудь (рекомендации самое лучшее в нашей сфере, никто уже не верит интернету, друзьям — верят).
Сам по себе ЮИ редко когда нужен без ЮХ, а второй как ты понимаешь просто так не освоить — это опыт и навыки приобретенные годами. Можно конечно зачитаться Раскиным и прочими писателями нашей сферы, но охуенных интерфейсов ты собирать не станешь.
Я лично сижу в советах бюро почти каждый день, куча открытых вкладок, читаю, записываю и тут же делаю. (Иногда нет, кхе-кхе).
Да, фронтенд важен, но и андроид-разработка пока что в тренде. Короче как-то так. Спрашивай конкретнее.
Я вот что-то делал, верстал. Получалось. Даже делал свой сайт рабочий на хостинге. Он состоял из таблицы, куда я записывал результаты тренировок. С месяц учил яву сейчас, чем дальше, тем кажется это все нереальный, особенно когда "смотрите на код, неважно, что вы сейчас ничего не понимаете". Было б что-нибудь без кода, но без него сейчас нечего перспективного нет. Как себя, сука взять и выучить уже что-то. 20-ый год уже скоро, а скиллов 0.
Допустим в студию, компанию сейчас попасть трудно, а выцепить заказ? Бле, опять код, Ява скрипт, без него нахуй никому не нужен и на таких сайтах, наверное. Может в вебе по-другому, но сомневаюсь, что там изи будет. Классы, ооп, хитровыебанная логика.
Делать с кем-то — очевидно же. Берешь на себя проект полностью, можешь даже не рассказывать о делегировании, ищешь фронт-ендера, поясняешь, делишься с ним бабками.
https://www.youtube.com/watch?v=EmXXzvrz_vs
CSS прямо в скетче, ну ваще охуеть.
CSS прямо в скетче, ну ваще охуеть.
А как конкретно пишется код а js, совсем не понятно, что там можно написать. Неужели все менюшки, анимацию при помощи массивов, коллекций каких-нибудь и т.д. писать?
Это как? Рисуешь в Скетче, получаешь рабочий код?
Вся анимация давно переехала на CSS.
Да, есть готовые библиотеки например wow.js + animate.css.
Нет, думаю до этого далеко, однако можно например часть разметки так написать, и передать разработчикам, чтобы не тупили. Функций поддерживается мало, я вчера вообще хохотал с этого плагина % )
Хм, даже так. Давно это произошло, несколько распространилось? Для чего тогда js сейчас?
Для ивентов, фреймворки для веб-приложений, библиотеки, много чего.
Шумов о подложках, ссылка ебучая, не знаю как сделать по-другому.
https://designpub.ru/%D0%B0%D0%BB%D0%B3%D0%BE%D1%80%D0%B8%D1%82%D0%BC-%D0%B0%D0%B2%D1%82%D0%BE%D0%BC%D0%B0%D1%82%D0%B8%D1%87%D0%B5%D1%81%D0%BA%D0%BE%D0%B3%D0%BE-%D0%BF%D0%BE%D0%B4%D0%B1%D0%BE%D1%80%D0%B0-%D0%BA-%D0%B8%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8%D1%8E-%D0%B3%D0%B0%D1%80%D0%BC%D0%BE%D0%BD%D0%B8%D1%87%D0%BD%D0%BE%D0%B3%D0%BE-%D1%86%D0%B2%D0%B5%D1%82%D0%B0-a887ca582ac7#.19m229o64
Класс!
Тем временем пикрелейтед.
Удваиваю. Какой-то затхлостью отдаёт. Ещё меня вымораживают их смайлики к месту и нет :-)
Скажи ещё, что это твой двощ.
С акценатми слабовато, имеется в виду призывы к действию. Кнопки не всегда находятся в одной «плоскости» с заголовками. В разделе «Блог» непонятно, где изображение к какой колонке относится. И что будет, если изображений не будет совсем? И где посмотреть все новости из блога?
>С акценатми слабовато, имеется в виду призывы к действию.
Подумаю че можно поменять.
>Кнопки не всегда находятся в одной «плоскости» с заголовками.
Не вижу в этом проблемы.
>В разделе «Блог» непонятно, где изображение к какой колонке относится.
Это экран прямо перед брейкпоинтом, дальше будет друго лей-аут, шире — больше паддинга. Сейчас можнет возникнуть некое сомнение, но думаю заголовки в цвет и смысл их же ясен.
>И что будет, если изображений не будет совсем?
Колонка номер 3. х3 (ничего ужасного)
>И где посмотреть все новости из блога?
Кликнуть на подчеркнутую "блог"
хорош
How To Learn GreenSock In 60 Minutes
https://ihatetomatoes.net/how-to-learn-greensock-in-60-minutes/
Курс по веб-анимации бесплатно, на английцком.
https://ihatetomatoes.net/how-to-learn-greensock-in-60-minutes/
Курс по веб-анимации бесплатно, на английцком.
Еще немного практикуюсь в тенях.
Дизайн пользовательского интерфейса 2. Искусство мыть слона
http://uibook2.usethics.ru/uibookII.pdf
http://uibook2.usethics.ru/uibookII.pdf
http://guglieri.com/
О сетках на редимаге
http://shkola.readymag.com/grid/practice/
Руководство дизайнера по DPI и PPI
http://sketchapp.me/rukovodstvo-dizajnera-po-dpi-i-ppi/
О сетках на редимаге
http://shkola.readymag.com/grid/practice/
Руководство дизайнера по DPI и PPI
http://sketchapp.me/rukovodstvo-dizajnera-po-dpi-i-ppi/
https://www.youtube.com/watch?v=s65Bn0_iYug
Блять, как же охуенно в интернете — все есть.
И бесплатно. Сиди и учись, смотри, рисуй.
Блять, как же охуенно в интернете — все есть.
И бесплатно. Сиди и учись, смотри, рисуй.
Сука, заебали уже эти скетчепоклонники. Из каждой щели лезут. А что мне делать, если я на винде? Страдать в фотошопе?
Ну иллюстратор есть, хули ты.
мимо анон, а чем иллюстратор или король дров принципиально лучше фотошопа?
Просто везде вижу в сцепке эти три редактора, а мне как бы всю жизнь хватало шопа, даже вектор поправить
В иллюстраторе гораздо больше инструментов для вектора и движок под вектор заточен (но блять баннер 10м в нем не сделать почему-то сука) Корел вывозит за счет базовости (стоит ВЕЗДЕ в отличие от иллюстратора, стоит во всяких рекламных производствах, потому что он может, в отличие от люстры, блять, сделать баннер 10м шириной)
Фотошоп — программа для обработки фото.
Ну в фотошопе же ограниченные функции векторных форм?
Если честно, мой опыт с фотошопом это покрутить гистрамку, но насколько я пользовался Аи, то он побогаче функциями.
фотожоп может собрать из 3d палок объект, наложить на него всяких с генерированных слоев и нарисовать пикрелейтед за 5-10 минут.
Вектор в нем как раз чтобы что-то примитивное сделать, шрифт подправить, сам им пользовался чтобы иллюстрации в индизайне править, конвертировать пакетом разношерстные картинки к одному виду и тд.
Удобно разкладывать на несколько цветов, опять же для типографских машин, чтобы меньший дизигнер это мог вывести на пленки.
Но меня пиздец удивляет просто повальное увлечение этими двумя. Я как то попробовал, в интерфейс врубаться почти с нуля нужно, а пользы так и не увидел.
Разве что чисто с вектором работать круглыми сутками. Хотя крутые аноны из ДС на службе у вэб погромистов может этим и занимаются
Например в Люстре есть ардборды, генератор таблиц,
паттерны, хз как там ща в Шопе.
Поправить вектор в Пс можно, а вот нарисовать - это геморрой. Люстра универсальнее + плагинами можно в шоп превратить
А на Figma есть инвайты или нужно тупо ждать, когда тебя зарегают? Нашел в какой-то статье, мол, аналог скетча, только браузерный. Захотел попробовать, а там "спасибо за регистрацию, теперь ждите"
Я тоже зарегался на фигму, пока нихуя. Ждем-с, думаю первый год все равно будет так себе, пока допилят там все.
Посмотрел, как рисуется в иллюстраторе в векторе, действительно быстрее, если проект трудозатратный.
+ огромный плюс это работа с пантонами, которые в шопе сделаны через жопу.
Вполне можно было сделать монтсра и все это реализовать в одном редакторе, а не обрезать по кускам. Им виднее
Фотошоп для фоток, как нахер один редактор? Векторные фотографии делать научился?
Вектор — Аи, Фото — Рh.
ОП, ты герой тысячелетия. Спасибо.
мимо вкатываюсь в UX
мимо вкатываюсь в UX
Братцы, а тут есть гуру по matte painting (рус: коллажирование)? Расскажите, где учились и как пришли к успеху.
Сейчас пытаюсь въехать в это, делаю уроки на фш-мастере, но это не то, к тому же собственных работ нет, т.к. не знаю достаточного кол-ва техник для их реализации.
Мб, поделитесь какими-нибудь секретами, как эффективнее вкатиться, или ссылками.
Спасибо.
Сейчас пытаюсь въехать в это, делаю уроки на фш-мастере, но это не то, к тому же собственных работ нет, т.к. не знаю достаточного кол-ва техник для их реализации.
Мб, поделитесь какими-нибудь секретами, как эффективнее вкатиться, или ссылками.
Спасибо.
Оп не умер, оп за 3 дня собрал промо-страницу о Тимирязвке, кому не в падлу — поддержите плиз.
http://sostim.ru/
http://sostim.ru/
Иляхов бы тобой гордился.
Годно, могешь, вообще пасан
Ебать за 6 лет первый раз здесь такое говорю. Даже хорошие работы, которые иногда могут мелькнуть, всегда не дотягивали немного, а ты прям молодец.
Короче нам надонатили на яндекс.деньги, сделал макет стикеров, закажем 500 штук. Размер 5х5 см.
Плакаты тоже будут.
Можно попробовать Эль Капитана на виртуальной машине запустить и накатить Скетча. Сам этого не делал, всё руки никак не дойдут, но в интернете можно найти положительные отзывы о таком способе получения Скетча на Винде. Держи сразу:
>el capitan инструкция: http://www.insanelymac.com/forum/topic/309654-run-vanilla-os-x-el-capitan-in-virtualbox-5010-on-a-windows-host/
>а вот образ: http://rutracker.org/forum/viewtopic.php?t=5132008
Иллюстратор абсолютно уёбищен, если использовать его для интерфейсов, как по мне. Пару недель назад открывал говно от одного дизайнера в этом формате, чуть не охуел, блядь, и ведь это не он долбоёб, это Люстрочка такая удобная.
>как по мне
А мне норм.
Да ты просто ничего лучше не видел, консерватор! Как я тебя, уничтожил просто. Просто собрал тебе портфель в школу.
Ну так-то я сейчас в скетче собираю. Сидел бы на винде делал бы в люстре. Особенно теперь, когда я прознал про мобильные множители и прочую радость.
А че кто-нибудь в Школу Яндекса делает задание? Я уже половину запилил. Целю в школу мобильного дизигна.
Посоны, вопрос такой, вот на пике первый экран.
Регистрация и вход вместе, главный идентификатор — и-мейл.
Если почта найдена и пароль совпал => юзер заходит как уже зареганный.
Если проверка по почте не прошла (значит такого аккаунта нет), то дальше идут последующие шаги регестрации (просим повторить пассворд, имя и тд).
Какие подводные камни я вижу — только если уже зареганный пользователь введет неправильный логин и его потащит внутрь регаться, поэтому на втором экране я подумал показывать введенный и-мейл, чтобы можно было сравнить (не опечатался ли).
Ну вот, че думаете?
Регистрация и вход вместе, главный идентификатор — и-мейл.
Если почта найдена и пароль совпал => юзер заходит как уже зареганный.
Если проверка по почте не прошла (значит такого аккаунта нет), то дальше идут последующие шаги регестрации (просим повторить пассворд, имя и тд).
Какие подводные камни я вижу — только если уже зареганный пользователь введет неправильный логин и его потащит внутрь регаться, поэтому на втором экране я подумал показывать введенный и-мейл, чтобы можно было сравнить (не опечатался ли).
Ну вот, че думаете?
>мобильные множители
чего?
Третья ссылка
Посоветуйте хороших примеров информативных веб-приложений, где было бы много графиков, таблиц и тд. У меня гугл-аналитикс и яндекс-метрика только на уме.
Блять, объясните на пальцах, как жить с этими множителями теперь? Я прочитал, теперь у меня еще большая каша в голове.
Как верстать хотя бы в фш или люстре, чтобы везде все одинаково смотрелось?
Пока ты нихуя не запускаешь, тебе хоть сто раз поясни, поэтому как попадешь в компанию — там и врубишься. Но коротко так:
под андроид рисуется в 1х, под айфон 1х, потом все умножается: для андроида 1х mdpi, 1.5x hdpi, 2x xhdpi, 3x
xxhdpi, 4x xxxhdpi. То есть кнопка например в 1х будет 40х40, а потом ты ее нарежешь для всего и будет: 40х40, 60х60, 80х80, 120х120, 160х160. Каждый контрол вот так. Для айос примено то же самое, но там суффиксы @2x, @3x, принцип тот же.
Ну, это не сложно. Я чет психанул, сорян.
Меня сейчас больше беспокоит десктопная верстка, в чем делать спецификацию для верстальщиков, в pt или px или em и как сделать сайт одинаково выглядящий на разных мониторах.
>Меня сейчас больше беспокоит десктопная верстка, в чем делать спецификацию для верстальщиков, в pt или px или em и как сделать сайт одинаково выглядящий на разных мониторах.
Лучше научиться верстать самому и править по ходу дела — подключаться в процессе. Если отступы в емах, то так и напиши, в любом случае в графике они пиксельные, но это сейчас легко переделывается теми же sass библиотеками.
Про мониторы уже было, 3-4 макета отлично покрывает одну страницу.
Парни, как научиться делать РАЗНООБРАЗНЫЕ сайты. Я заметил, что все мои работы -- это одни и те же прямоугольники, выполненные в разном цвете. Как это лечить? Куда донатить?
inb4: больше делать. Мб, знаете какие ресурсы с туторами или ещё что -- делитесь, а то горит.
inb4: больше делать. Мб, знаете какие ресурсы с туторами или ещё что -- делитесь, а то горит.
Тебе нужно освежить кругозор. Поаутируй денек на бехансах или на пинтересте, посмотри чужие идеи, что-то бери на вооружение.
Почитай о "вертске по форме". Меня спасает. А еще надо наворачивать фотошоп и его скиллы, если чувствуешь что скилл голой верстки уже окрепчал, то время заняться тех. иллюстрациями. Стал босом в иллюстрациям? Прокачай кодинг и тд.
Так вырастают нужные спецы.
Что самое интересное и одновременно обидное -- почти все работы с дрибла технически могу повторить без проблем, но вот когда дело доходит до самостоятельных работ, всплывают эти ебаные одинаковые прямоугольники
Пиздец как дизморалит эта хуйня, не знаю, что делать
Просто ебашь. Легче всего сделать редизайн. Чужие ошибки видно всегда, а тенюшки и градиентики лишь, хз, пару дней задротства.
http://blog.invisionapp.com/becoming-a-designer-who-codes/
Короче тут вывалили огромный список обучающих материалов, есть что посмотреть.
Using design patterns responsibly
https://medium.com/@intercom/using-design-patterns-responsibly-4eb2c73a87b4#.i13swc8oh
Designing More Efficient Forms: Assistance and Validation
https://uxplanet.org/designing-more-efficient-forms-assistance-and-validation-f26a5241199d#.wqfhkxuhl
Книжки по типографике на английском, бесплатная
http://practicaltypography.com/
Короче тут вывалили огромный список обучающих материалов, есть что посмотреть.
Using design patterns responsibly
https://medium.com/@intercom/using-design-patterns-responsibly-4eb2c73a87b4#.i13swc8oh
Designing More Efficient Forms: Assistance and Validation
https://uxplanet.org/designing-more-efficient-forms-assistance-and-validation-f26a5241199d#.wqfhkxuhl
Книжки по типографике на английском, бесплатная
http://practicaltypography.com/
Все короче. Сделал задание в школу Яндекса, на 6 дней раньше дедлайна. Надеюсь зачтут в +. Покажу после того как пришлют ответ, если кому интересно.
В какой форме сделал? ПДФку запилил?
Я чот разогнался, думал нахуярю макеты, прототип в инвижоне и ещё презентацию запилю лонгридом. А потом оказалось что там только один файл можно прикрепить, и то до 20 мб.
Сделал 2 джейпега длиннющих, один с улучшениями, второй с процессом проектирования. Папка с отдельными макетами, и файл ридми, в нем о том как смотреть правильно + редимаг-страничка с презентацией продукта + рассказ о себе коротенький.
И все запаковал и архив, 10 мб. Норм :^)
1 файл, не больше 20 мб, лайфхак.
Ну ты молодец конечно, что запотел, но как по мне, так архив не очень хорошая затея. Да и копаться в файлах, чтобы найти ссылку на редимаг тоже не будут я думаю.
Ну не будут так не будут, просили же один файл.
¯ \ _ (ツ) _ / ¯
пс думаю что все таки будут.
Ох блять, я второй день сижу голову ломаю чего бы им в приложениях можно такого улучшить, чтобы стало пижже. Прям пиздец как сложно.
Там же просто дохуя ошибок, за 20 минут накатал им небольшое полотенце.
Не знаю о каких именно ошибках ты говоришь, я игнорирую все ошибки верстки например.
Пытаюсь какие-то глобальные найти, пока что нашел две, лол.
Если у тебя получилось полотенце, будь добр, приведи в пример что-нибудь, что не вошло в полотенце, чтобы я понимал о каких именно ошибках ты говоришь.
Ошибки верстки тоже ошибки. Есть логические, типа разделенный функционал, неправильный синтаксис интрфейса и тд. Еще они везде знак рубля проебывают, лол.
Нашел концепт какого-то чювака на бихансе.
https://www.behance.net/gallery/35729057/koncept-prilozhenija-jandeksputeshestvija
https://www.behance.net/gallery/35729057/koncept-prilozhenija-jandeksputeshestvija
Красиво местами, но вся суть сервиса проебана.
Верно.
Пикрил
Кстати чювак то на первом месте в школе стажеров сейчас.
Не прочитал о техзависимости, кхе-кхе-кхе.
Какой чувак?
Интересно, сколько анонов из треда пилят задания для Яндекса?
Нас как минимум двое.
Третий день ебусь с этой ебалой
Недавно читал статью одного злого зарубежного чувака, где он разносит миф о том что веб-дизайн обязательно должен быть графически "сексуальным". Он убрал со своего лендинга почти все, сделал формы и шрифты крупными, чтобы даже дядя Ваня попадал, поставил картинки телок и получил рост конверсии 118%
>Какой чувак?
Не знаю что за сексуальность, дизайн решает проблемы бизнеса. Коммерческий.
Ну и чей-то за говно опять? Эти ебучие картинки с пляжами, которые всегда одинаковые и затрудняют читать текст над ними, и эта ебаная кнопка с датой, которую пока не выберешь кнопка найти не разблокируется, сук, я просто хочу узнать че по деньгам, одну выберешь - нет нихуя, другую выберешь - нет нихуя. Ну так на поиски билетов, с этими Путешествиями хуйзнает что там. Вроде, на Авиаселес эту хуйню убрали, но недавно на поезд хотел узнать цену билета, так и дропнул в итоге, заебавшись угадывать даты, когда есть вообще отправления. И где фильтыр по цене и упорядочить по цене.
Пздц, я почти от всех сайтов и приложений бугурчу, напихают говна нинужного, а к нужному хуй доберешься, как этим Васяны пользуются вообще не понятно.
Давай лучше, хуль ты.
Это тренд - делать не удобное, но прилизанное говно, удобные варианты никто не примет, они будут не достаточно засраны маркетинговыми модулями.
Это сервис про пляж и пальмы, с хуя ли ты жалуешься на пляж и пальмы в картинках?
Работа нормальная, но суть упущена, уже сказали.
Потому что текст читать плохо на этих пальмах, блять. А сами пальмы не добавляют информативности, т.к. все юзают клипарты, обычно никто даже не париться, чтоб фотка была из конкретнйо страны, кругом одна и та же ебучая пальма.
народ, а что по этой самой сексуальности макетов можно почитать? я понимаю, как должно быть, понимаю основное там сетки/типографика/акценты/контраст, но вот свои макеты выходят какие-то... как будто что-то важное упускаю.
ну то есть условно - у всяких там мелких и даже некоторых средних бизнесов я обычно улучшаю положение дел в дизайне, а вот у крупных боюсь испортить что-то или не дотянуть до того, что у них обычно. хочется выйти за эти рамки, но не знаю как(
Блять это концепция, ты охуел. А то что он пишет текст на фотках — его косяк. Не могу сказать хорошо это или нет.
Дрибла почитай.
Ну зайди на реальные сайты, там те же ебаные пальмы, евривер, блять.
Найс. Сказали что тем кто подал в последние два дня устроят анальную модерацию :^)
Я тоже читал в группе, это всё пиздеж :^)
Удачи с поступлением в школу, анон
Вчера пришло письмо — позвали на интервью в скайпе.
Ну главное еще там не налажать, аминь.
Найс, поздравляю. Ты за 6 дней отправил?
Я в предпоследний, скоро и до меня дойдут :3
Покажи хоть какое письмо, замажь что надо и покажи.
Да, я пораньше сделал.
>Покажи хоть какое письмо, замажь что надо и покажи.
Просто письмо, написано "у вас интересная анкета, давайте поговорим в скайпе". Ничего сакрального, даже скриншот лень делать.
Бессоный бамп на мертвой доске.
Посоны, а какая у вас цель в карьере?
Посоны, а какая у вас цель в карьере?
На бехансе подхватил эту тупую манеру фотографировать монитор? Не делай так, пожалуйста.
Да не, я сидел в тиндер играл и тупил, сфоткал и закинул только для вас, ребятки. Кстати не веду профиля ни на дриббле ни на бихансе. Второе считаю дикой помойкой.
Господа, вы можете наблюдать типичного представителя дизайнеров-ньюфагов он уже научился двигать квадраты в фташопах, но еще нихуя не врубился. Дай бог тебе силы, бро.
Двиганье квадратов такая же необходимая рутинка как и все остальное. Кстати в фотошопе не сижу, ну.
Бирман о теории близости в интерфейсе.
http://artgorbunov.ru/bb/soviet/20160503/
http://artgorbunov.ru/bb/soviet/20160503/
>Кстати в фотошопе не сижу
Это как гордиться тем, что не смываешь за собой.
Божечки, хватит флудить в одном из живых и нормальных тредов. Если ты хочешь поспорить с кем-то — пиздуй в /б и не выебывайся.
Ну что? Интервью было уже?
Рассказывай как всё прошло.
Завтра после обеда будет. Расскажу как прошло и что спрашивали.
Давай, я буду ждать. Подробно расскажи.
Тебе еще не отвечали?
https://www.youtube.com/watch?v=XMEvSxMdsfA
Смотрю тут, поцоны молодчики офк.
Смотрю тут, поцоны молодчики офк.
Фух. В общем спрашивали:
Где учился, как пришел в дизайн.
Говорю ли по-английски. Чем отличается создание мобильного продукта от десктопного продукта. Организационные моменты переезда, как буду работать и учиться в одно время. Есть ли у меня знакомые в Яндексе. Вроде все.
Я тоже кое-что поспрашивал % )
Заебись, я думал ещё какое-то тестирование устроят.
Надеюсь тебя возьмут, будешь нам инсайды сливать.
Далеко тебе до Москвы ехать?
Мне не ответили пока, видимо до моей анкеты ещё не дошли.
Ламповый у нас тред, рад за тебя.
Не так далеко, 3 часа до Вены на басике, оттуда часа 2 до Москвы самолетом.
К слову моя работа, раз уж такой пляс пошел:
https://readymag.com/u15840325/527916/
Это ты просто так по-быстрому страницу накидал? В приложение не вникал, но вот эта подача выглядит супер убого.
Ну не то чтобы по-быстрому, за день наверное.
А че там вникать? симпл эз зис % )
анончики поясните почему у всех ux-дизайн ресурсов и ux-гуру сайты в стиле стандартного шаблона вордпресса 2002 года?
Удваиваю вопрос.
Потому что веб-дизайн нужен, чтоб пускать пыль в глаза инвесторам, а чтоб пыли было больше создается этот анальный цирк вокруг сферы. Все интерфесы делаются просто исхдя из здравого смысла, который приводит к вордпресс шаблону 2002 года, и вообще все основные паттерны еще на первых маках утвердились, а дальше их все копировали, иногда дорабатывая (но не васьки дорабатывали, а лиды в офисах ойти-гигантов), из-за появления новых технологий.
>Все интерфесы делаются просто исхдя из здравого смысла
Хуйню написал. Исходя из технических ограничений.
это я к тому клоню что вся эта хуитень вокург UX это такой большой мыльный пузырь, в основном юх-гуру и специалисты это просто те кому очень хочется быть дизайнерами но они нихуя не умеют, не будь они ux-дизайнерами то стали бы мммщиками или какими то форекс-пидорами. Больше бесит то что то что раньше делали дизайнеры просто потому что это так и должно быть, вывели в отдельную сферу и написали тонны книжечек, в итоге я вижу как в крупных компаниях половина дизайнеров это люди которых ты никогда не найдешь на бихансодриббле зато их линкедин засран 10 летним опытом в сфере ux и всякими сертификатами, в худшем случае они сами еще пытаются учить кого то на каких то курсах.
http://artgorbunov.ru/bb/soviet/20160511/
Бля, умеет же нозик из говна конфетку сделать.
Бля, умеет же нозик из говна конфетку сделать.
Он так за нехуй добавил верхний уровень категорий и тип норм, а у заказчика готовая база на стотыщ позиций без этого уровня и, скорее всего, есть обкатанный скрипт на автоматизацию импортов-обновлений, без учета таких выебонов и доплачивать за допилы никто не собирается, пох азазаз, главное на картинках в бложики няшно показать. И там всегда такая хуйня у них, функционал меняют и делают няшно под новый, когда, скорее всего, вопрошающему проблему нужно решить не залазя в бекенд.
Машина должна делать работу, иначе нахуя она?
Давайте жаловаться что css долго писать и вообще ебашить чистым хтмлом. Хули нет то? Работать будет? — Будет.
Теоретически такая менюшка может принести гораздо больше прибыли чем сэкономленные 100к ₽ на разработчике. Да и вообще, стратегия "экономить" всегда проигрышнее чем стратегия "больше зарабатывать". Если ты понял о чем я.
Стратег ты диванный.
Советую и тебе стать, здесь неплохо платят.
бросил он небрежно и втащил вторую дорожку
Заебал, которые раз гоню тебя отсюда, или хотя бы пиши по факту, раз начали дискутировать — так защищай свою позицию, а не сливайся как лошок.
Между тем дизайн-дайджест от Ветрова https://vc.ru/p/vetrov-18
Добавил он в след, когда дверь уже захлопнулась.
- Черт, нервный какой-то стал. Сраный колумбиец, явно бадяжит стафф какой-то дерянью.
Добавил он в след, когда дверь уже захлопнулась.
- Черт, нервный какой-то стал. Сраный колумбиец, явно бадяжит стафф какой-то дерянью.
Jade используется просто как увеличения скорости и удобства написания? Сам он не используется на сервере, придется конвертировать в html?
В целом да, можно еще вроде на локалхосте его запустить.
Как добиться такого же крутого качества? Есть какие-нибудь туторы/книги я хз. Чтобы вот так выдавать.
у меня два вопроса по картинке:
нахуя нужен календарь, в котором отмечены только пятницы и субботы?
если так опереться на моцик, он не наебнётся разве? как-то меня смущает её поза в контексте взаимодействия с данным мотоциклом
(более опытные коллеги возможно ещё что-нибудь вроде несоответсвия масштабов или перспективы разглядят. я не уверен, что оно там действительно есть, но вдруг)
картинка ВЫГЛЯДИТ качественной, потому что сделана из качественных исходников, которые не нагрузили всякой левой лишней ебаниной. вот и весь секрет - простота + качественные исходники.
как всегда. Как дело доходит до ответа -- сливаются. Как критиковать так сразу 1000 мнений. Иди нахуй ущерб короче впизду этот раздел.
Вообще-то картинка говно.
Делается это обычным дрочем доджа и бёрна по серенькому с режимами наложения там и потом еще свет и рефлексы сверху. Когда-то тут даже сайт мелькал, где продавали штук 5 видео-гайдов по ретуши в этом колхозном стиле.
Бар работает только по пт и сб - от того такой календарь.
Можешь кинуть ссылку? Если не трудно.
ты в глаза ебёшься что ли? я тебе написал - качественные исходники, вот и весь секрет, тут и туторы никакие не нужны
>Иди нахуй ущерб короче впизду этот раздел
ты и сам не подарок, дождался одного ответа и сразу ныть и нахуй посылать, ну пиздец просто
Тебя интересует как фото сделано? Он же ответил, что дрочь бёрна и доджа, гуглани на ютубе хоть эту технику обработки, чего такой ленивый. Можешь в /p закинуть, там по обработке может накидают конкретных туторов, но скорей всего тамошние илитарии ее и тебя вместе с ней просто обоссут за попсовость и то, что она не чб.
Фотка кстати недокрашена. Кто-то ебался-ебался с лицом и телом, но на руки положил болт. Особенно на правой видно, у нее пальцы как у старухи какой-то и это контрастирует с "чистым" телом и лицом. Ну и мне лично не нравится, что мотоцикл находится отдельно. Он либо был приклеен потом, либо его специально или случайно по цветам отделяли от модельки. Как-то глаз режет почему-то.
Надпись рок-рол квин я бы в синьке сделал, а потом композом бы ее до такого довел. Тут тоже гугли уроки по синьке или в чем тебе удобней, какие-нибудь titles там, например. Можно и в шопе сделать, но тут дело привычки.
Сзади кинули какой-нибудь круглый градиент рамп, а поверх всего оверлеем наложили какую-нибудь текстуру, чтобы все "сбить" в один тон. Ну и бокеху с виньеткой. Бокеха тоже косячная. Видишь справа в районе колеса она выглядит как серое говно? Это потому, что когда накладываешь, что-то скрином то нельзя ставить опасити ниже 100% (ну или не сильно ниже), потому что выходит такая вот ебала.
Погуглил пикчу и создателей. Странно, что вроде позиционирует себя как ааа-контора, а так косячат.
Ладно, спасибо. Уже более вменяемый ответ в дизаче. Ток контора это топовая у нас, лучше нет скорее всего.
>контора это топовая у нас, лучше нет скорее всего
Ну пиздец. Это печально.
Ну хуй знает. Я очень сомневаюсь что в дизаче хоть так кто-то сможет. Ну не именно этот пик повторить а выдавать такой результат на поставленную задачу.
А тебя не смутило, что я про каждый элемент из твоего постера расписал, указал их ошибки и написал как бы делал это сам?
Олсо, у них там студия, т.е. делал не один человек. Как минимум два - фотограф (к нему плюсом идут визажист и ко) и дизайнер. А скорей всего там участвовал еще и артдиректор и стоило это все дохуя. А результат с такими косяками. Я бы на месте заказчика бугуртил.
Ну и собственно какой там результат? Девушка-бдсмщица на мотоцикле под надписью рок-н-ролл кафе? Оригинально пиздец. Это ж надо было додуматься до такого! Наверное ночами не спали, пока рождали идею для этого постера.
>Задача разработать рекламную кампанию для продвижения тематической вечеринки в стилистике рок-н-ролл
>Решение С учетом стилистики вечеринки мы разработали название «Rock-n-roll Queen», и, совместно с питерским фотографом Мурбо Даглдияном создали загадочный, дерзкий и сексуальный образ «королевы рок-н-ролла».
Загадочный, дерзкий и сексуальный образ «королевы рок-н-ролла» на пикрелейтеде. Имхо, модель не подходит, слишком стандартное и глуповатое лицо. В нем нет загадочности, обычная тупая илитарная пизда и по ней не похоже, что слушает рок. Я ее не гуглил и не знаю кто она, но ее фото вызывает такие эмоции, а должна вызывать другие.
Постер для стрип-клуба. Что бы там не писали.
Понимать как это делается и сделать разные вещи.
Два дня читал тред с хуем в руке. Надо бы поднять.
Годная лекция о шрифтах от А. Каптерева http://vk.com/video-64913393_171188755
Годная лекция о шрифтах от А. Каптерева http://vk.com/video-64913393_171188755
Охуенная лекция, спасибо!
Поучись у Паясу.
Это может работать в магазине, в который редко добавляют товары (раз в год, например).
Если у меня в ассортименте пять досок для серфинга, я могу сделать все как на пике.
Насчет неочевидности и кривости макета согласен, да.
Брал Ангуляр, фигачил на нём (оплачиваемый!) проект. Благо, на работе в то время как раз вовсю использовали Ангуляр для SPA — было где посмотреть.
Но предупрежу, Ангуляр штука такая, что взрывает мозг поначалу, надо разобраться и пообвыкнуться.
>Вся анимация давно переехала на CSS.
Вруша, без js всё равно никуда.
Делал сайт с подобным функционалом, проблема короче простая: всем лень пилить у себя сервак с актуальными данными, всё высасывается у операторов в момент твоего поиска.
Мы работали через ифейс Слетали, каждый запрос — платный. Копеечный, но за миллионы запросов выйдут десятки тыщ рублей. Плюс, оплата неслабого сервака для обработки, плюс канал, плюс софтина которая всё это будет обрабатывать.
Не знаю, почему Яндекс не может себе этого позволить, но наша некрупная компания явно не могла. Отсюда и сложные формы поиска, и куча неактуальных результатов поиска.
Се ля ви — дизайнеры на то и дизайнеры, чтобы придумывать красивые решения в некрасивых ситуациях.
Годно. Там, где на фоне город («Узнай все о городе» и далее) — вообще улёт.
Ребят, расскажите о том, как вы креативите и какие техники излюбленные используете при этом.
Когда начинаю делать дизайн, то либо заимствую идею и палитру откуда-то и начинаю работать от этого, собственно говоря, плагиат чистой воды.
Где можно освоить основные техники оформления или приёмы, использующиеся в дизайне на данный момент, которые можно было бы использовать в своих проектах.
Скажем так: боевой арсенал ТИПИЧНОГО веб-дизайнера.
Прошу, подскажите пожалуйста.
Заранее благодарю.
Когда начинаю делать дизайн, то либо заимствую идею и палитру откуда-то и начинаю работать от этого, собственно говоря, плагиат чистой воды.
Где можно освоить основные техники оформления или приёмы, использующиеся в дизайне на данный момент, которые можно было бы использовать в своих проектах.
Скажем так: боевой арсенал ТИПИЧНОГО веб-дизайнера.
Прошу, подскажите пожалуйста.
Заранее благодарю.
Также делаю. После прочтение <<кради как художник>>. Через год посмотрим, если не работает впизду этот дизайн.
Та же фигня. Вообще, мой процесс выглядит так: бумага, Axure, lo-wi макет, затем hi-wi макет в ФШ. И это еще далеко не конец. Если ux-макет в Axure утверждён, то секс с тенюшечками, шрифтами, градиентиками и цветами может быть достаточно долгим. Иногда готовлю сразу несколько визуальных концепций, иногда делаю нарочно плохую и хорошую концепцию. Быает, и обсираюсь — клиент выбирает плохую, после этого, из плохой уже делаю хорошую. Часто ворую с Беханса, Дриббла, aWWWards, The FWA, и прочих тематических сайтах. Любой визуал, который понравился схороняю или в скриншоты, или в Evernote. Психую, начинаю всё заново, если не нравится макет.
Поясните за фриланс. С чего начать и где собственно. Желательно на своем опыте. Сам имею год работы в агентстве. Ну уровень поболее чем у аутистов которые пишут на флру якобы у них опыт 10+ лет. Нужны ли там про акки и тд и тп. Желательно не забугорные. Я от русских то клиентов не всегда понимаю что они хотят а уж на английском и подавно обосрусь.
1. Берешь чужое
2. Адаптируешь под цели проекта
3. ?????
4. Профит
Поясни, как именно и откуда берёшь? С каких его работ?
> 2016, все унифицировано и стандартизировано.
> спиздить чужой дизайн
А спиздить цвета это как? Скопировать #ffd34e? Нихуя вы бандиты. Хинт: меняйте на #ffd34d - выглядит похоже, но ни один суд не докажет.
> спиздить чужой дизайн
А спиздить цвета это как? Скопировать #ffd34e? Нихуя вы бандиты. Хинт: меняйте на #ffd34d - выглядит похоже, но ни один суд не докажет.
Господа фуллпроцессеры, в общем, такая ситуация, меня возможно берут UX-дизайнером на работу, в связи с чем я решил освоить HTML + CSS + JS хотя бы на базовом уровне, чтобы уметь верстать интерактивные прототипы всякого всего, что я нарисую, заодно чтобы платили больше (хотя бы за то, что я на леваках сам свои макеты буду верстать).
В связи с этим вопрос - с какого ресурса или книжки начать?
Я люблю, когда у меня под рукой есть какой-то справочный материал, открыл озон и охуел от количества книг и хуй поймёшь, что из этого хорошее, а что - нет. Присматриваюсь к ресурсу codeacademy, но немного смущает инглиш, не то чтобы это прям проблема была, но боюсь потеряться в технических терминах, на русском попроще будет. И вообще, насколько хорош codeacademy, может что-нибудь ещё посмотреть вместо него?
В связи с этим вопрос - с какого ресурса или книжки начать?
Я люблю, когда у меня под рукой есть какой-то справочный материал, открыл озон и охуел от количества книг и хуй поймёшь, что из этого хорошее, а что - нет. Присматриваюсь к ресурсу codeacademy, но немного смущает инглиш, не то чтобы это прям проблема была, но боюсь потеряться в технических терминах, на русском попроще будет. И вообще, насколько хорош codeacademy, может что-нибудь ещё посмотреть вместо него?
htmlacademy
Интерактивные прототипы быстрее всего делаются в марвеле и инвижине — быстрее там же и итерируются. Выучить хмтл + ксс, это 1 месяц. + 1 месяц на джейэс.
htmlacademy выглядит интересно, начал проходить раздел Знакомство, пока всё просто и понятно, тем более небольшая база по HTML у меня есть (в универе проходили, но оч поверхностно, т. к. и программа устаревшая, и специальность недизайнерская; ну и с программистами много общаюсь, когда сайты поднимаем какие-нибудь и обсуждаем, как лучше ту или иную хуйню реализовать)
имеет ли смысл там подписку брать? или лучше навернуть бесплатную программу и что-нибудь ещё?
и хватит ли htmlacademy для моих целей?
марвел и инвижн посмотрю, спасибо
да, хтмлакадеми будет достаточно если купишь подписку — у них там в конце все свежее, вообще это даже многовато у них там, со всеми тонкостями что они объясняют.
Ребзя, есть какие-нибудь курсы %желательно на русском по web-design, которые можно найти на трекерах? Уже давно хочу вкатиться во фриланс, вроде вем-дизайн одно из самых популярных направлений во фрилансе. Владею люстрой, шопом, умею в 3d и анимацию.
Есть, ищи сам, посмотри на складчине или еще какой хуйне.
Отвечаю на вопросы и помогаю тем кто хочет вкатиться.
Так же поясняем за вокрфлоу, тулинг и прототипирование.
Ключевые слова для треда: webdesign, front-end, UI, UX, prototyping, sketch, html (jade + emmet), css (sass + bourbon), grunt, gulp, bower, responsive, pixel perfect, trends, usability, dribble, photoshop, animation, self-learning.
Поехали!