Дизайнеру на заметку — что необходимо нарисовать для сайта на LiveStreet 1.0
Этот пост для тех, кто хочет нарисовать свой уникальный и неповторимый дизайн для сайта на LiveStreet CMS. В нем я хочу перечислить то, что придется нарисовать, отдельно акцентируя внимание на блоки, которые можно упустить или не догадаться. Список получен эмпирическим путем, при работе над Synio.
000 — Главная страница
а) вид для авторизованного и неавторизованного пользователя
б) Прямой эфир — комментарии / публикации
в) Попап-блок с текстом комментария для Прямого эфира
г) Попап-блок со статистикой голосов
д) Пользовательское меню
е) Панель «Создать» (черновик, топик, блог, сообщение, событие, галерея)
ё) Системные сообщения («ошибка» / «OK»)
ж) Сортировки — Интересные / Новые +k /Обсуждаемые / TOP (период: За 24 часа / За 7 дней / За 30 дней / За все время)
з) Информер о новом сообщении
010 — Авторизация
а) неверный логин/пароль
020 — Напомнить пароль
030 — Регистрация
а) регистрация завершена
100 — Лента блога
а) Виды топиков: пост, голосование, ссылка, фотоотчет | черновик, закрытый
б) Информация о блоге
110 — Топик
а) Голосование (+ / — / воздержался)
б) В тексте — Ссылка, ссылка-пользователь, заголовки (H5, H6, H7), цитата, код
в) комментарии — новый, мой, прочитанный, активный. Выделенный топикстартер.
г) написать комментарий
200 — Блоги
а) Сортировки — Название / Кол-во читателей / Рейтинг
б) Попап-блок с информацией о блоге
в) поиск
300 — Люди
а) Выборки:
— по активности — Все / Онлайн / Новые
— по рейтингу — Все / Положительные / Отрицательные
— по алфавиту (поиск с автоподстановкой)
— по стране и городу
б) Сортировки: Ник / Сила / Рейтинг
в) статистика — гендерная и количественная
400 — Профиль пользователя («чужой») — Информация
а) добавить заметку
410 — Стена
420 — Публикации (топики / комментарии)
430 — Избранное (топики / комментарии)
440 — Друзья (аналогичен разделу «Люди»)
450 — Активность
500 — Профиль пользователя («свой») — Информация
520 — Публикации (топики, комментарии, заметки, черновики)
530 — Избранное (топики / комментарии)
540 — Друзья (аналогичен разделу «Люди»)
550 — Активность
560 — Сообщения (список цепочек)
а) поиск писем
561 — Новое письмо
562 — Новое письмо
563 — Избранное
564 — Блокировать
570 — Настройки профиля
571 — Настройки аккаунта
572 — Настройки сайта
600 — Создать пост
а) Блок «Доступные теги»
б) предпросмотр топика
610 — Создать блог
700 — Активность
а) добавить людей
800 — Текстовая страница (Например «О проекте»)
810 — Страница ошибки (404)
Кроме того, для тех, кто работает в команде рекомендую сервис Worksection — именно с помощью него велась удаленная работа, при разработке Synio.
Если у кого-то из дизайнеров есть инвайт на Dribbble, буду признателен за приглашение – спасибо borodox за инвайт и отдельное спасибо KaMaToZzz за помощь в его получении!
Список необходимых экранов
В реале получается немного больше, за счет отрисовки всех сценариев.000 — Главная страница
а) вид для авторизованного и неавторизованного пользователя
б) Прямой эфир — комментарии / публикации
в) Попап-блок с текстом комментария для Прямого эфира
г) Попап-блок со статистикой голосов
д) Пользовательское меню
е) Панель «Создать» (черновик, топик, блог, сообщение, событие, галерея)
ё) Системные сообщения («ошибка» / «OK»)
ж) Сортировки — Интересные / Новые +k /Обсуждаемые / TOP (период: За 24 часа / За 7 дней / За 30 дней / За все время)
з) Информер о новом сообщении
010 — Авторизация
а) неверный логин/пароль
020 — Напомнить пароль
030 — Регистрация
а) регистрация завершена
100 — Лента блога
а) Виды топиков: пост, голосование, ссылка, фотоотчет | черновик, закрытый
б) Информация о блоге
110 — Топик
а) Голосование (+ / — / воздержался)
б) В тексте — Ссылка, ссылка-пользователь, заголовки (H5, H6, H7), цитата, код
в) комментарии — новый, мой, прочитанный, активный. Выделенный топикстартер.
г) написать комментарий
200 — Блоги
а) Сортировки — Название / Кол-во читателей / Рейтинг
б) Попап-блок с информацией о блоге
в) поиск
300 — Люди
а) Выборки:
— по активности — Все / Онлайн / Новые
— по рейтингу — Все / Положительные / Отрицательные
— по алфавиту (поиск с автоподстановкой)
— по стране и городу
б) Сортировки: Ник / Сила / Рейтинг
в) статистика — гендерная и количественная
400 — Профиль пользователя («чужой») — Информация
а) добавить заметку
410 — Стена
420 — Публикации (топики / комментарии)
430 — Избранное (топики / комментарии)
440 — Друзья (аналогичен разделу «Люди»)
450 — Активность
500 — Профиль пользователя («свой») — Информация
520 — Публикации (топики, комментарии, заметки, черновики)
530 — Избранное (топики / комментарии)
540 — Друзья (аналогичен разделу «Люди»)
550 — Активность
560 — Сообщения (список цепочек)
а) поиск писем
561 — Новое письмо
562 — Новое письмо
563 — Избранное
564 — Блокировать
570 — Настройки профиля
571 — Настройки аккаунта
572 — Настройки сайта
600 — Создать пост
а) Блок «Доступные теги»
б) предпросмотр топика
610 — Создать блог
700 — Активность
а) добавить людей
800 — Текстовая страница (Например «О проекте»)
810 — Страница ошибки (404)
Бонус — список сайтов для анализа
Проекты, на которые я бы рекомендовал посмотреть, прежде чем начинать рисовать- Хабрахабр
- DOU
- LAM, The Village, FurFur,
- Список шаблонов «Живого журнала»
- Ридус
- Сноб
- Слон
- Русский GQ
- Теории и практики
- Esquire
- НАШ
- Cargo
- Афиша
Кроме того, для тех, кто работает в команде рекомендую сервис Worksection — именно с помощью него велась удаленная работа, при разработке Synio.
P.S.
При продвижении сайта очень важно своевременно и правильно оценивать его текущие позиции. Встречайте новый сервис для оптимизаторов! Line.pr-cy.ru — мониторинг позиций сайта.
15 комментариев
600 — Создать пост
в) модальное окно для добавления изображений
А в бонусном списке сайтов от силы 2-3 можно взять для анализа. Остальные же «клонированые» и перестилизованные. Грамотный верстальщик с мало-мальским эстетическим чутьём может сделать что-то подобное и сам, без каких-либо макетов, глядя на доноров.
Да, выглядит очень даже не плохо.