[Книга] Refactoring UI - Complete Package + Видео - Видеоуроки

Refactoring UI - Complete Package
Duration 00:40:42
Открыть все курсы от adamwathan

Refactoring UI - Complete Package - Полный список уроков

Развернуть / Свернуть
  • Урок 1. Designing a complex form interface 00:11:13
  • Урок 2. Building a data-focused dashboard 00:17:20
  • Урок 3. Styling a text-focused landing page 00:12:09

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

«Я знаю, это выглядит ужасно, но я понятия не имею, почему».

Привет! Меня зовут Адам Ватан, я фулстек разработчик, который раньше не любил дизайн.

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

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

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

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

Дизайн с тактикой, а не талантом.

Вот конкретная тактика проектирования, которую, я уверен, вы применяете каждый день, но явно не заметили:

Используйте меньше границ.

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

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

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

Работая вместе, мы знали, что можем создать что-то лучшее.

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

Refactoring UI объединяет все, что мы знаем о дизайне, и объединяет его в один комплексный пакет, включающий книгу, скринкасты, галерею компонентов, специально разработанные ресурсы и многое другое.

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

Что мы собрали

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

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

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

Вот что у нас получилось ...

Книга

Прекрасный PDF-файл, содержащий 50 невероятно визуальных глав, распространяется на 250 тщательно набранных страницах.

Эта книга содержит буквально все, что мы знаем о веб-дизайне, разбита на короткие, легко читаемые главы.

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

Мы ненавидим книги, которые повторяют одни и те же идеи снова и снова, чтобы заполнить счетчик страниц. Эта книга написана во многом как наши посты в блоге - каждое предложение достойно внимания.

Видео уроки

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

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

  • Разработка интерфейса сложной формы
  • Создание информационной панели, ориентированной на данные
  • Стилизация текстовой целевой страницы

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

Галерея компонентов

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

Галерея компонентов - это огромный ресурс, содержащий более 20 категорий компонентов / макетов и более 200 отдельных стилей компонентов.

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

  • Стили кнопок
  • Макеты страницы входа
  • Разделы маркетинговой страницы
  • Макеты карт
  • Табличные стили
  • Схемы навигации
  • ... и многое, многое другое.

Вам больше никогда не придется просматривать другой сайт для вдохновения верстки.

Цветовые палитры

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

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

Рекомендации по шрифтам

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

Мы собрали список из более чем 30 шрифтов, которые нам очень нравятся, и разбили его на три категории: пользовательский интерфейс, заголовки и копии статей.

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

Если вы когда-нибудь чувствовали себя неловко, пытаясь выбрать шрифт, это сэкономит вам массу времени.

Пользовательские иллюстрированные иконки

Refactoring UI также включает в себя набор из 200 прекрасно иллюстрированных иконок SVG: SVG предварительно оптимизированы, и цвета могут быть легко настроены в соответствии с вашим брендом с помощью всего лишь CSS - знание инструментов проектирования не требуется.

Complete package

  • 250-страничная книга в формате PDF
  • Все три подробные видеоуроки
  • Галерея вдохновения для компонентов, включающая более 200 идей компонентов и макетов
  • Более десятка полных цветовых палитр, адаптированных для пользовательских интерфейсов приложений
  • Витрина шрифтов, в том числе более 30 рекомендаций по категориям шрифтов
  • Эксклюзивная библиотека иконок, включающая 200 легко настраиваемых иконок SVG

Твоя оценка

42 0
Следи за последними обновлениями и новостями в нашем coursehunter-club.net (Ex coursehunters.club), или вступай в наш канал telegram.

Комментарии

Последнее добавленное

Разработчик на Spring Framework

Разработчик на Spring Framework

ru
Курс будет полезен всем. От Junior Java-программистов, не имеющих опыта работы со Spring, с минимальным опытом с IoC-контейнером Spring или испытывающих трудности с ним до архитекторов и тех.лидов, желающих узнать про современные возможности Spring для решения высокоуровневых задач.
Appium Android: простое руководство по автоматизации тестирования

Appium Android: простое руководство по автоматизации тестирования

en
Автоматизируйте собственное тестирование мобильных приложений под Android с помощью Appium и Java. Работа с реальными устройствами и эмуляторами Android. Этот курс по автоматизации тестирования мобильных приложений c Appium обучает вас простому, прямому подходу, всего за 5,5 часов видео...
Gatsby - Генератор статических сайтов для React - Полное руководство

Gatsby - Генератор статических сайтов для React - Полное руководство

en
Создавайте потрясающие сверхбыстрые веб-сайты с помощью React и GraphQL, начинайте работу со стеком JAM и подходом Headless CMS. В этом курсе вы узнаете, как создавать удивительные и сверхбыстрые статические веб-сайты с помощью Gatsby.js. Gatsby - это невероятно быстрый современный генератор...
Изучение Python, Tkinter и Django

Изучение Python, Tkinter и Django

ru
​Данный видео курс предназначен для людей, которые хотят научиться программировать на языке Python. В курсе будут рассмотрены базовые моменты языка Питон, а также рассмотрена тема работы с библиотеками. Вы научитесь писать программы под ПК при помощи фреймворка TKinter, а также создавать мощные...
Serverless React c AWS Amplify - Полное Руководство

Serverless React c AWS Amplify - Полное Руководство

en
Создавайте полнофункциональные приложения React быстрее, чем когда-либо, которые масштабируются до миллионов пользователей и работают исключительно в облаке! Хотите создавать удивительные, производительные и в целом лучшие приложения React? Смотрите не дальше, чем AWS Amplify. Этот курс - лучшее...
BDD с Cucumber и Serenity BDD

BDD с Cucumber и Serenity BDD

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

Курс по айдентике

ru
В основе курса методика, которая применяется в российских брендинговых агентствах и Высшей Школе Брендинга. Курс записан в ноябре 2017, состоит из 20 вебинаров. Каждая лекция завершается домашним заданием и списком полезных книг для развития навыка. Вы можете выполнять один из учебных брифов...
chat
logo