{"id":9478,"title":"\u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0442\u0440\u0430\u0442\u0438\u0448\u044c, \u0442\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0430\u043a\u043e\u043f\u0438\u0448\u044c","url":"\/redirect?component=advertising&id=9478&url=https:\/\/vc.ru\/promo\/317067-korotko-nakopitelnyy-schet-stavka-po-kotoromu-zavisit-ot-summy-trat&placeBit=1&hash=d207611bc9f0e6594fdffbb28a750052a6fdd69fcd26c1c4f03600bcfe768326","isPaidAndBannersEnabled":false}
Дизайн
Embacy

Как мы сделали редизайн сайта «Сколково» sk.ru

К нам в Embacy пришел фонд «Сколково» за редизайном сайта. Мы немного удивились, так как работаем в основном с диджитал-продуктами, но на проект с радостью согласились, потому что у некоторых наших клиентов стоит логотип «Сколково» в подвале. Символично, что теперь в подвале sk.ru ссылка на нас.

Новая главная sk.ru

Какая стояла задача

Перейти от преимущественно новостного сайта к платформе, рассказать и показать, что «Сколково» представляет из себя сегодня. Старый сайт выглядел так:

Главная страница старого сайта

Что получилось:

Финальная версия обновленного сайта

Нахимичили, или рассказ про концепцию

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

Наши встречи проходили в Квартале Менделеева в «Сколково»

В этом здании. Если присмотреться, в левом верхнем углу написано: "Mendeleev Quarter"

Логотип «Сколково» напрямую отсылает к элементу таблицы Менделеева:

Поэтому мы взяли за основу концепции сайта… таблицу Менделеева.

Маркетинговый текст звучит так: Менделеев упорядочил химические элементы в систему, а «Сколково» упорядочивает российские стартапы.

Стилистика: табличный минимализм

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

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

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

Участников «Сколково» на главной странице оформили с корешками по направлениям:

Инфраструктуру «Сколково» отрисовали линейными иллюстрациями, единственными вписавшимися в стилистику, а также сделали множество иконок:

В табличной стилистике мы «почувствовали нотки» швейцарской типографики, поэтому шрифт Formular дополнил картину: гротеск без засечек, но не слишком классический. Серьезный ровно настолько, насколько нужно.

Как мы это все утверждали

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

Что сделали, чтобы процесс прошел эффективно

  • Не показывали промежуточных версий

Например, концепцию и стилистику согласовывали на примере кликабельного прототипа главной страницы в фигме (посмотрите, там даже есть анимации).

  • Четко распределили роли внутри

Этот проект научил нашу горизонтальную структуру трансформироваться четкую в вертикаль (у нас получилось 4 уровня), теперь мы пользуемся этим навыком по необходимости

  • Действовали итеративно

Разбили проект на 12 спринтов, и двигались последовательно, сдавая по частям. На нас был только дизайн, поэтому команда «Сколково» смогла приступить к верстке уже после второго спринта. Вроде банально, но банально удобно.

Итого: 16 уникальных страниц и шаблонов

Финальная фигма с высоты птичьего полета:

Отдельно отметим страницу с тем, как стать резидентом «Сколково». Она выглядела так:

Мы переработали ее и расписали путь:

Разделили «что нужно сделать, чтобы стать участником Сколково», и «что делать после того, как стал участником Сколково», отдельно выделили преимущества, полезные документы и ссылки

0
27 комментариев
Популярные
По порядку
Написать комментарий...
Удивленный звук

Двоякое ощущение... Вы вроде как помогли им, а вроде как и испачкались.

В превью (ссылка ниже, но можно даже не открывать — описание и так видно) утверждается, что это «некоммерческая организация», а всё равно вызывает столько неприязни, словно это чёрная дыра для бюджетных денег 🙄

Почему такое негативное восприятие, интересно? 🤔

Ответить
4
Развернуть ветку
Alex Marvell

Ты сам ответил на свой вопрос (про дыру).
На, не скучай))

Ответить
12
Развернуть ветку
Anton Reut

Квадрокоптер совершил {{Роскомнадзор}} ?

Ответить
0
Развернуть ветку
Artyom Pasko

Я призадумался. Не уверен что ребята испачкались. Представим 3 пути развития событий:
1. Sk заказывает сайт непонятно у кого за небольшие деньги и получает трэш.
2. Sk заказывает сайт за бешенный деньги у условного агенства Апостол и понятно куда идут средства.
3. Sk заказывает сайт у ребят из поста, получает хороший результат за вменяемые деньги. 

Мне кажется третий сценарий самый нормальный и мы как раз в нем. Ну  я верю что embacy не попилочная)

Ответить
4
Развернуть ветку
Anton Reut

Иконки - жесть, шрифты - жесть... Вы реально считаете что Ариал это лучший шрифт для веба?... 

Ответить
4
Развернуть ветку
Александр Баурсак

— Ваш сайт говно!
— Но это же сайт Сколково.
— Тогда недурно!

Ответить
4
Развернуть ветку
Sergey Mikhalev

У вас в портфеле хорошие сайты, а это работа стажера из 2010-го ? =/

Ответить
3
Развернуть ветку
Anton Reut

Ребята осваивают Corel Draw че вы докопались )))

Ответить
2
Развернуть ветку
ivan krapivin

Не трожь Короля Дров!

Ответить
0
Развернуть ветку
Anton Reut

Да я сам в нем много всего делаю ))

Ответить
0
Развернуть ветку
Папка Файлов

Сколько вам заплатили за работу?

Ответить
1
Развернуть ветку
Папка Файлов

это сайт про бизнес а не дизайн, нормальный вопрос 

Ответить
1
Развернуть ветку
Евгений Пологов

1. Нет единого стиля – просто визуальная «каша» (шрифты, иллюстрации, ховер-эффекты, полоски – какое-то нагромождение кусков разных тем, которые спорят с друг другом).   
2. Ощущение несерьезности от сайта какая-то подростковая тематика – компьютерные игры из прошлого. 
3. Нет ощущения инновационности, хотели про будущее, а получилось про прошлое. 
4. Первый экран – никакого Wow. Просто унылая картинка здания и блок новостей из прошлого века. 
5. Глазу не за что зацепиться, ощущение пустоты, не радует. 

Как-то даже стало обидно за ребят из Embacy – поклонник их работ. 

В чем же кроется причина?  Такое ощущение, что очень сильно хотели сделать круто, но перемудрили.  Возможно заказчик очень сложный.  Коллеги, расскажите,  были ли сложности с заказчиком?   При этом сама идея с таблицей Менделеева вполне логична. 

Ответить
2
Развернуть ветку
Веб-студия RichBee

Аккуратная, но очень слабая работа с точки зрения дизайна.

Ответить
2
Развернуть ветку
Alexander Kalinnikov

Мои впечатления:

Плюсы: Дизайн упростился, шрифт стал крупнее, лишние картинки удалили. Стало проще, это позитив.

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

Минус 2: Зачем выносить сервис "Застройщику" в один ряд в поиске с разделом Инвесторам и Инноваторам. Неужели Застройщиков в Сколково столько же, сколько и Инноваторов? Судя по сайту, выходит, что да.

Минус 3. Вместо "Инноваторам" в "Сервисах" я бы писал "Резидентам"

Минус 4. Помимо стартапов-резидентов, есть еще корпорации, которые открыли свои R&D подразделения в Сколково. На мой взгляд, это важнейший пласт обитателей Сколково, которые сейчас остались без своего блока на сайте. Их не найти и не выделано раздела сервисов для них.

Минус 5. Кто придумал термин "Уставной капитал" в карточках компаний? Есть Гражданский кодекс, есть Закон об ООО, и везде написано "УставнЫй капитал".

Минус 6. Я бы показывал в карточках полный статус взаимодействия стартапа и фонда. Сейчас не хватает даты получения статуса резидента, суммы полученных грантов ("нет", если не выделялись), дат выделения грантов ("нет", если не выделялись).

Минус 7. Есть теории экосистем, законы Рида, Меткалфа и прочее. Критически важно для масштабирования, чтобы узлы экосистем становились сами "мини-экосистемами". В контексте Сколково, в карточках стартапов не хватает того, какие услуги они могут оказывать другим стартапам. Нужно стимулировать горизонтальные связи на уровне стартапов.

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

Минус 9. Случайно заметил. Есть сервис "нотариальные услуги". На странице сервиса перечислены эти услуги, которые не полностью бьются с законом о нотариате (не совпадает количество услуг). Нужно или не перепечатывать законы вообще, или перепечатывать их правильно.
К тому же, на сайте самого этого избранного нотариуса нет ни слова о том, что он работает или хоть как-то связан со Сколково, а сидит себе на Сивцевом Вражке. Если Сколково к нему направляет тысячи компаний, стоило бы это отразить на сайте нотариуса.

Минус 10. Сколково стало большой территорией, много чего построено. Была бы очень полезна интерактивная кликабельная карта, что где находится. Да, есть отдельный сайт skolcity, но я бы показал карту на главном сайте. Карта дает ощущение масштаба, размаха. Это важно.

Минус 11. На мой взгляд, категорически не хватает "Историй успеха". Это просто важнейший блок. Есть много скептиков, которые задают вопросы типа "Ну и что там ваше Сколково сделало, где результаты?" Для ответа на подобные вопросы и нужен подобный блок - сделано было действительно много, и много чего полезного. 

Ответить
2
Развернуть ветку
Ольга Янковская

Вы бы там пофиксили 404. Хотя бы с этой страницы: https://sk.ru/education/

Ответить
–1
Развернуть ветку
Anton Reut

Они еще и про SVG не знают - все иконки размытые. Инновации хуле.

Ответить
3
Развернуть ветку
Иван Д.

очень плохо!

Ответить
1
Развернуть ветку
Эльдар Канзафаров

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

Ответить
1
Развернуть ветку
Алексей Кирякин

Таргет "лендинга по лендингам" на интересы "Сколково" оправдался :D

Ответить
1
Развернуть ветку
Embacy

Пустили ностальгическую слезу))

Ответить
0
Развернуть ветку
Петр

Вот за один такой экран вашего стажера надо нахуй уволить — настолько круто раскиданы стрелки и расстояния до значения на весь экран. Что листать, куда нажимать. И так сойдет.

Ответить
1
Развернуть ветку
Black Brother

А мне нравится и дизайн, и сама концепция, минимализм в действии.

Ответить
0
Развернуть ветку
Bella Donn

О, сайт сколково это пока самое интересное что я видел от сколково за 10 лет.  

Ответить
0
Развернуть ветку
Buddhism Press

а как же санта-барбара с пономаревым и прочими скандалами о растратах? ))

Ответить
0
Развернуть ветку
Sabit Sugirov

Много белого, скучновато. 

Ответить
0
Развернуть ветку
Boris Zyryanov

Не смогли в  ?
Новое слово в типографике?

Ответить
0
Развернуть ветку
Читать все 27 комментариев
Мощные сервисы для быстрого машинного обучения: от GPU SuperCloud до суперкомпьютера

В последние три года мы видим рост спроса на технологии искусственного интеллекта (ИИ) и машинного обучения. Они проникли практически во все сферы нашей жизни, начиная от различных колл-центров и городских систем видеонаблюдения, заканчивая системами медицинского скрининга и диагностики заболеваний. Даже для оплаты проезда в столичной подземке…

«Купи сейчас, плати потом»: новая классика или мимолетная мода

Сервис рассрочек рассказывает о новом финтех-тренде.

Использование закона Фиттса: основной принцип UI/UX при разработке интернет-магазинов

Математический закон середины XX века применяют к дизайну UI-интерфейса онлайн-магазина, чтобы превратить посетителей в клиентов.

«Комитет» объявил о планах продать сервис коротких видео Coub Статьи редакции

Компания, владеющая vc.ru, dtf.ru и tjournal.ru, планирует в ближайшее время найти нового владельца для проекта, сообщил на своей странице в Facebook сооснователь «Комитета» Влад Цыплухин.

Как слабоумие и отвага, доширак и донорство крови помогли нам сделать платформу для ИИ-роботов и поднять раунд 50 млн

Tomoru.ru — платформа для создания умных голосовых роботов для бизнеса. Мы начинали как AR/VR-студия, а теперь создаем цифровых помощников для СберМаркета, Skillbox и других клиентов. Бизнес может собрать себе робота сам или заказать готового у сертифицированных партнеров Tomoru.

«Если клиенты видят халяльный логотип, это придаёт им уверенности в продукте»: как устроен исламский банкинг в Индонезии Статьи редакции

Местные финтех-стартапы могут развиваться только после одобрения представителей исламского духовенства. Какие сложности преодолевают предприниматели, чтобы создать приложение по законам шариата, — в пересказе Rest of World.

Как сделать работу компаний и фрилансеров удобной

С помощью сервиса «Рокет Ворк».

Роскомнадзор потребовал от Tor удалить «запрещённую информацию» — в случае отказа сеть заблокируют Статьи редакции

«Запрещённые» данные находятся на странице, где рассказывается о проекте.

Новый дизайн «Секрета фирмы» учтёт пользовательские сценарии потребления и поиска контента

О трендах бизнеса и экономики можно прочесть коротко и ясно в удобных форматах

null