табличный дизайн

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

Известно, что какао-порошок и шоколадные изделия иногда содержат кадмий (Cd) и свинец (Pb) природного (ссылка при нажатии на свинец, рынок сша, поэтому нашего шоколада нет) происхождения. Это особенность этих бобов. Они активно всасывают тяжелые металлы из земли. Чем выше % какао, тем больше металлов. Примеры плиток и % от суточной нормы на фото. Везде нужна мера. Любите шоколад?

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

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

статья дня: digit ratio (она же 2d:4d ratio) — про соотношение длины указательного и безымянного пальцев. пишут, что есть взаимосвязь между соотношением пальцев и уровнем тестостерона, формой черепа, сексуальными предпочтениями, социализацией в мире, результатами в разных видах спорта и даже успешностью в жизни. (уже посмотрели на свою руку?)

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

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

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

расскажу ещё две истории на тему вчерашнего поста. первая история — из главы «вместо таблицы» нашего курса, где мы приводим много примеров когда таблица — не самое идеальное средство для сравнения. как-то мне в голову пришла гениальная идея: вместо того, чтобы каждый раз сортировать бельё перед стиркой, лучше бы его сортировать пораньше — когда отправляешь в грязное. то есть иметь не одну корзину для белья, а несколько: для светлого, для тёмного, цветного, красного и т. д. я начал искать коробки в икее и офигел от их стандартов: то ширина плавает, то высота, то глубина. как выбирать-то? и я конечно сделал табличку — щас по ней всё быстренько сравню. ага! снова офигел: а как сравнивать-то? ну понял я, что вот эти коробки длиннее. мне надо запомнить теперь имена этих демонов и отсортировать по ширине? короче, плюнул я на такой формат и сделал всё в объёме — сравнивать сразу стало проще. ну а потом сделал по ним стеллаж, и использую такую схему сортировки белья до сих пор и всем рекомендую.

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

Та-даааам! Дарлинги, перед вами — до/после. Была задача — перерисовать сводную таблицу проекта дома №1. Сам проект создан в excel, переделывать его я решила в figma (возможно, стоило это делать в miro). Если вы думаете, что тут работы "нефиг делать", то ошибаетесь, потому что... Какие основные изменения произошли? • избавление от линеек (просто здесь они не нужны) • отказ от кв.м и объединение единиц измерения с цифрами • работа с отступами (не прибегаем к буллитам или тире) • выравнивание всего (колонок, разрядов, вертикального и горизонтального ритмов) • изменение текстовой части: расшифровка аббревиатур или отказ от лишних слов, которые смысла не меняют (например, площадь кладовых → кладовые) Откровенно говоря, с таблицей мне действительно пришлось поковыряться, потому что пока: • разобралась в терминологии • прочитала и осмыслила эту таблицу • перенесла ее из excel • ну а далее пошла сама работа по переверстке (с которой, кстати, мне помогли — но об этом будет следующий пост) А если хотите посмотреть весь процесс изменения, то заглядывайте в комментарии(20-й круг правок). #работыадмина

довольно часто люди спрашивают: а сколько стоит реклама на канале? и каждый раз я отвечаю: да бесплатно! просто покажите нам всем какую-нибудь интересную табличку или расскажите о собственном процессе переделки таблицы. я даже предлагаю с этим помочь (на курсе практика у нас за деньги). сколько людей отваливается при таких условиях — можете угадать. но бывают люди, которые фигачат, не сдаются, переделывают, и в итоге получают классный результат и сами становятся лучше. аня, которая ведёт канал 20-й круг правок — одна из таких людей. аня — молодец и крутышка. подписывайтесь на её канал.