Критика: как сделать визуальное различие между контентом и опциями в посте лучше?

У меня есть дизайн, который в настоящее время выглядит примерно так:

http://i.imgur.com/G4HgYoW.png

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

Обратите внимание, что дизайн не является блочным (как в Facebook), где каждый пост получает свой собственный блок. В этом случае следующий и предыдущий пост находятся сразу под нижней границей.

Как я могу сделать визуальное различие между параметрами публикации и содержанием публикации?

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

Ответы (3)

Лично я согласен с DA, что пробел здесь наиболее полезен, и, может быть, просто увеличить его будет достаточно.

Еще несколько возможных вариантов:

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

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

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

Довольно сложно предлагать предложения, когда мы не можем видеть общий контекст, для которого мы это предлагаем (вся страница), поэтому я дал варианты, которые вы можете попробовать.

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

«Просто поместите все параметры справа».

Привет Кишан, добро пожаловать в GDSE и спасибо за ваш ответ. Если у вас есть какие-либо вопросы, обратитесь в справочный центр или свяжитесь с одним из нас в чате , как только ваша репутация станет достаточной (20). Продолжайте вносить свой вклад и наслаждайтесь сайтом!

Я бы предпочел «Группировать», прежде чем делать какой-либо макет. сгруппируйте похожие элементы вместе в соответствии с функцией и основным «элементом», который вы представляете.

пост — это самая важная вещь в этом макете, за ним идут имя и изображение, а затем вспомогательные инструменты, такие как «поделиться» и «комментарий». Все это полезные инструменты для участия пользователей, но они не являются главным героем в макете. Я сгруппировал их вместе.

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

введите описание изображения здесь

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

Надеюсь, я объяснил это хорошо.

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