Alexander Greene

Дизайн Дайджест — Март 2✦21

2021-04-02T21:40:33.760Z

Мои события за Март.

Мар 2021

1 Марта

Стартовал финальный этап олимпиады «Я профессионал», напомню, что моё направление — дизайн, а профиль «продвижение цифрового продукта», курирует это дело вышка.

Отсылка к цифровому продукту, который я разрабатываю.

9 Марта

Устроил небольшую коллаборацию с маленькой студией, которая разрабатывает приложения под платформу VK mini-apps. Ребята захотели сделать нативное приложение для iOS, поэтому позвали меня курировать дизайн.

src: developer.apple.com

10 Марта

Сделал заглушку для своего сайта, получилось просто и понятно, идеальное решение аля «mobile first», ещё подключил блог в телетайпе под свой домен, а то чё пылится-то!

greens.design & blog.greens.design

greens.design

20 Марта

Представил айдентику для FindFound.me, она ещё в разработке, на данный момент согласовываем паттерны и цвета, логотип заверен.

26 Марта

Завершил задание для олимпиады «Я профессионал», хоть что-то я успел!

→ Файл презентация

29 Марта

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

30 Марта

Купил новый MacBook на M1. Жду когда доставят. Может быть сделаю обзор :)

Подписывайтесь на социальные сети ↘︎

Сайт: https://greens.design/

Кейсы: https://dribbble.com/evergreene

TG-Канал: https://t.me/greenelers

Связь: theoneperson

Дизайн Дайджест — Февраль ✦

2021-02-28T21:27:39.408Z

Все что произошло со мной за Февраль, где работал, что сделал и что собираюсь наделать.

Фев 2021

4 Февраля

Купил домен для своего нового сайта → greens.design
upd: мой бложек доступен по ссылке → blog.greens.design

Надеюсь, что к Апрелю мы успеем выпустить все в продакт, а пока ничего не ждите.

5 Февраля

Дизайню сайт, понимаю, что остаётся 4 дня до выхода на очное обучение. Ничего не успеваю, горят дедлайны по задачкам из Января.

9 Февраля

Карантин закончился, начался очный семестр. Едем учиться.

Пробки, морозы и снег в Москве, кайф!

12 Февраля

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

14 Февраля

Прилетел инвайт в Clubhouse. Забавно, что днём ранее я писал почему эта соц.сеть переоценена, а на следующий день получил к ней доступ.

Чтобы не пропускать свежие новости, подписывайтесь → t.me/greenelers

15 Февраля

Академия Яндекса. Начал выполнять тестовое задание, чтобы летом попасть на обучение. Выбрал продуктовый дизайн, 29 марта расскажу что да как.

Я отправлял им анкету 3 дня. Много хотели!

21 Февраля

Не отправляю тестовое задание в artlebedev.ru
Не успел, было много других дел.

Устал дизайнить, если честно.

23 Февраля

Начал работать над айдентикой для FindFound.me. Знаю ребят уже продолжительное время, прошли вместе хакатон. Они делают классный сервис для поиска работы нацеленный на студентов.

В этот раз я не продуктовый дизайнер и это интересный опыт.

24 Февраля

Нарисовал uikit для iPhone OS.

На данном этапе я допиливаю компоненты, поэтому этот проект может появиться немного позже в Figma Community.

26 Февраля

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

Иллюстративный кадр из рекламы Эпла, ну вы поняли.

27 Февраля

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

Upd: уже пригласили потыкать!

С первым днём весны!

Подписывайтесь на социальные сети ↘︎

Кейсы: https://dribbble.com/evergreene

TG-Канал: https://t.me/greenelers

Связь: theoneperson

Дизайн Дайджест — Январь 2021.

2021-02-02T21:23:36.749Z

Всем привет, меня зовут Александр Грин и я дизайнер интерфейсов. Сейчас мне 19 лет. Это мой микроблог о том, что произошло со мной за январь, чего я добился и кем стал.

Первый выпуск дизайнерского дайджеста посвященного только Александру Грину.

31–1 Января: 20–21

Закончили разрабатывать тест скорости для typing.school. Прототип сделал неделей ранее, но разработать и сверстать успели накануне нг.

→ Пройти тест скорости

1 Января

Провели около дизайнерскую сходку из чатика «Курлычем» в Москве, хорошо посидели и погуляли!

5 Января

Завёл тик-ток для спидартов. Рисую там реалистичные эпловодобные эмодзи. За первый день набрал 3.6K просмотров и 1.1K лайков — успешно.

→ Тик-ток

На момент начала.

21 Января

Пригласили на заключительный этап олимпиады «Я профессионал»

Нужно было разработать концепцию продвижения цифрового продукта на любую тему, я и сделал. Взял наш старый проект по фудшерингу «Еда даром» и нарисовал для него постеры.

→ Файл презентация

26 Января

Попал в Figma Community и выпустил два mockup'a макбуков. Сделал эти мокапы по причине отсутствия нормальных альтернатив, дублируйте в фигме!

→ Мои мокапы

28 Января

Решил перерисовать в фигме UI Kit для IOS 1 от известного объединения teehan+lax. Just for fun, возможно, для души.

Результат — скоро в Figma Community.

30–31 Января

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

31 Января — 1 Февраля

Решил нарисовать сайт про борщ, видимо, тема с борщецом преследует меня, если успею заняться этим, то отправлю.

Результат ожидайте.

Подписывайтесь на социальные сети ↘︎

Кейсы: https://dribbble.com/evergreene

TG-Канал: https://t.me/greenelers

Связь: theoneperson

Мой год в IT-cтартапе.

2020-11-08T18:14:52.067Z

Субъективное впечатление о работе в развивающемся стартапе с точки зрения дизайнера.

И печатай со скоросью мысли ♥︎

✦

Итак, прошёл год с тех пор как я начал заниматься разработкой дизайна для Typing School. Что такое Typing School? Это сервис по слепой печати, который наиболее пластично подходит к развитию навыка той самой слепой печати, без нудной бредятины вроде бессмысленных сочетаний букв и прочего. В целом, алгоритм у нас получше чем у большинства русскоязычных сервисов той же направленности. Это стоит признать, а если не верите, то зайдите на typing.school

Впрочем, это не мешает нам совершенствоваться, и это уже второй релиз, так называемый MVP 2.0, в котором я как UX/UI дизайнер — постарался рефрешнуть все что только можно, но это не касается только UI-составляющей дизайна, UX мы разработали почти с нуля, если сравнивать с результатом на Апрель 2020.

Как все началось?

Ещё осенью прошлого года у меня не было ни одного масштабного проекта для портфолио, я занимался лишь дизайном для сайтов, если честно, UX-ом там даже не пахло. Ближе к середине октября мне выдалась возможность поучаствовать в разработке зарождающегося стартапа из акселератора университета ИТМО.

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

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

— Итак, почему захотел рискнуть и начать дизайнить?

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

Разрабатывая Typing School я стремился к простоте и минимализму, к этому современному тренду белых интерфейсов*, без капли серого и унылого. Поэтому я взял за основу наш фирменный синий и белый, смешав их, я получил приятную палитру и широкоформатный интерфейс, который легко адаптировать под все платформы. Постепенно, месяц за месяцем я старался шлифовать его, создавать дизайн-систему, в какой-то момент, я придумал для себя хобби — рисовать emoji в стиле apple, полностью в svg и в точной схожести с оригиналом. Так как в нашем сервисе эмодзи уделяется большое внимание. Они играют роль универсального языка общения, причём даже для разных поколений, этот формат вполне уместен.

Малая часть всех эмодзи, которую я могу показать вам.

Раскладки, системы и буква Ё.

Первой, несомненно, нестандартной задачей было понять, как нам разделять пользователей по типу клавиатуры. У нас было несколько критериев:

Пользователь пользуетсяMac/Windows & Linux?
Какой тип раскладки используется ANSI или ISO?
В чем отличия американскойраскладки от европейскойна Mac?

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

Актуальный вид настроек клавиатуры. На Апрель–Ноябрь 2020.

Раскладки в современном мире можно разделить на два основных стандарта ANSI и ISO. Как правило, все Mac на территории Европы имеют тип раскладки ISO, но обычные клавиатуры для Windows/Linux имеют американский стандарт ANSI.

Их основные отличия:

Enter: в ANSI вытянутый, в ISO — высокий, на два ряда.
Shift: В ANSI оба шифта длинные, в ISO левый Shift короткий.
Буква ё: иногда скачет на Mac, в зависимости от того какие настройки.

Enter главная боль европейских пользователей Mac, но короткий shift тоже неудобный

У буквы ё свой особенный путь на раскладках Mac, к примеру есть две распространённых раскладки: Русская и Русская ПК. Например, запятая и точка на раскладке «Русская» находятся сверху, на кнопках 6 и 7 соответственно. В «Русская ПК» более привычный случай, кнопка / около правого шифта, по дефолту ставит точку, а если зажать шифт, появится запятая.

Русская, расположение буквы ё

Для меня предпочтительнее раскладка «Русская», потому что я привык к ней изначально. Сколько людей, столько и мнений.

Русская ПК, расположение буквы ё

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

Это было весело ❖

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

Я в ноябре 2019 :)

Первые интерфейсы.

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

Первый месяц разработки.

Страница настроек была моим первым нестандартным интерфейсом, в ней сочетались гибридные поля и невнятные стили для них :)

Правда, сейчас, они выглядят довольно нереалистичными. Но основная концепция осталась и имеется на сайте!

Страница лимита ошибок, которая так и не увидела свет

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

Проверьте прямо сейчас ↖︎

Версия: Зима 2020

Страница тренажёра — это моя гордость. В ней воплощены самые классные идеи, которые только у меня были. Основные фишки — это css клавиатура и крутейшие руки, которые помогают новичкам ориентироваться и не смотреть на свою клавиатуру. Кроме того, после релиза MVP 2.0 весь сервис был переписан с нуля на vue, теперь это веб-приложение.

Web flow

UX и любовь к мелочам

Я очень люблю мелочи в дизайне. Мелочь, а приятно! Вот что заставляет меня пользоваться определёнными сервисами, согласитесь, что удобнее пользоваться тем, где тебе легче разобраться? Да, так и есть. Поэтому UX составляющей в этом релизе я уделил большое внимание.

Интерфейс: светлые тона и объёмные иллюстрации

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

Экраны с притягивающими внимание иллюстрациями. Версия Июнь 2020.

Возрастные рамки:

Большинство сервисов схожей тематики стремятся охватить школьную аудиторию, это понятно, т.к. основные потребители такого контента — школы. Но, я считаю иначе: детей не стоит считать за отдельный вид, они такие же взрослые, такие же потребители контента. Не имеет смысла добавлять яркие и вырвиглазные цвета только чтобы дети заметили. Проще всего сделать сервис, которым будет интересно пользоваться и ребёнку и взрослому. Все зависит от механики обучения, а не от густоты красок и рисованных картинок!

А вот и пример:

Самая прекрасная страница оплаты, с рукодельными эмодзи и приятым ui.

Дизайн человека из 21 века

Да, не секрет, что разрабатывая интерфейс для typing school мне было всего 17 лет, сейчас уже 18, но это ничего не меняет. Одним из главных преимуществ нашего сервиса я считаю свежий взгляд на вещи.

Прочитайте любой материал на typing school и посмотрите сколько строчек он занимает! Это правда невероятно. Формулировка, объём и подача текста играют важную роль в образовательном процессе точно также как минималистичный дизайн.

Не буду обещать, просто посмотрите на тайпинге↖︎

Релиз нового лендинга уже на Typing School

Геймификация:

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

Алгоритмы:

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

Подводим итоги

Итак, как я провёл этот год в маленьком IT-стартапе? Наверное, это был самый классный год за последнее время, несмотря на то что происходило в мире, моя жизнь сильно изменилась. Без опыта, который я получил, работая в typing school, я был бы не настолько прокачен как сейчас. Каждая маленькая победа даёт мне силы и новые идеи.

Маленький список наших побед за этот год:

Конкурс грантов Газпром-нефть. Победа в конкурсе грантов «Университет ИТМО Газпром нефть» в номинации Прототип.
Demo day в преакселераторе университета ИТМО. Грант за 1 место в конкурсе demo day преакселератора университета ИТМО.

и многие другие ✦

Ваш, Грин.

Подписывайтесь на социальные сети ↘︎

Кейсы: https://dribbble.com/evergreene

TG-Канал: https://t.me/greenelers

Связь: theoneperson