Интересный тест на логику. Кто может помочь?

Question

[tytytyapp]

Based on the logic of the example below you need to complete the task:
Create the row with 10 dots. Change their visual appearance to meet the following requirements:
Requirement 1 – all dots are divided into 2 groups
Requirement 2 – each dot from group 1 has 2 types of visual properties
Requirement 3 – the whole row has one accent dot
Requirement 4 – all dots in group 2 have 3 levels of hierarchy
Requirement 5 – horizontal division (x axis) of the whole row should be asymmetrical

Исходя из логики приведенного ниже примера, вам нужно выполнить задачу:
Создайте строку с 10 точками. Измените их внешний вид, чтобы соответствовать следующим требованиям:
Требование 1 - все точки разделены на 2 группы
Требование 2 - каждая точка из группы 1 имеет 2 типа визуальных свойств, которых нет в группе 2
Требование 3 - весь ряд имеет одну точку акцента
Требование 4 - все точки в группе 2 имеют 3 уровня иерархии
Требование 5 - горизонтальное деление (ось х) всего ряда должно быть асимметричным

Comments

[Antonio Solo]

это думать надо. утром и на трезвую голову.

[Antonio Solo]

2 types of visual properties - у меня сложности с пониманием этой фразы. "цвет" и "размер" - подходят ? но ведь какой-то цвет и какой-то размер есть и во 2-й группе ?

[Сергей Соколов]

Antonio Solo, может, скажем, острота углов и паттерн заливки

[Alexej Simakov]

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

[Antonio Solo]

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

паттерн заливки - да, но ведь и заливка сплошным черным цветом может быть описана через паттерн ?

хотя если на каждой точке из 1-й группы будет нарисовано фото негра, тогда "прическа негра" будет свойством отсутствующим во 2-й группе

[xmoonlight]

кубы какие-то)

[Сергей Соколов]

Antonio Solo, тут точки – не геометрические безразмерные точки, а чёрные диски. Так что можно и другие вольности себе позволить

[Сергей Соколов]

откуда такое интересное задание? Есть ещё? : )

Answer 1

[xmoonlight]

Требование 1 - все точки разделены на 2 группы

Делаем 2 блока разделённых свободным пространством.

Требование 2 - каждая точка из группы 1 имеет 2 типа визуальных свойств, которых нет в группе 2

1-я группа содержит 7 точек.
1-я группа:
Оформление для всех точек группы: круглые, с тенью, с обводкой чёрным.
Цвета (оформление сохраняем!): сначала 3 белых, чёрная, 3 серых.

2-я группа - 3 точки: серые, круглые

Требование 3 - весь ряд имеет одну точку акцента

10-я точка - салатовым.

Требование 4 - все точки в группе 2 имеют 3 уровня иерархии

размер: 1x, 3x, 2x с выравниванием по нижнему краю.

Требование 5 - горизонтальное деление (ось х) всего ряда должно быть асимметричным

(вроде как уже сделали?... в п.4)

PS: похоже на визуальное отображение шагов какого-то теста(/анкеты/"карусели" с фотками/слайды/etc.) с 2-мя кнопками и с текущим шагом (блок из 3-х элементов в конце), например: "Назад" 25 "Далее" (назад/далее - стрелками, например)
В общем, что-то такое имеется ввиду, кмк...

Comments

[Сергей Соколов]

«многабукф». Тут про дизайн вопрос. Хорошо бы нарисовать, а ещё круче программно генерить изображение из структуры данных.

[Сергей Соколов]

Требование 4 - все точки в группе 2 имеют 3 уровня иерархии

Иерархия подразумевает ссылки на родительские и дочерние. Просто размера тут недостаточно.

[xmoonlight]

Сергей Соколов,

ещё круче программно генерить изображение из структуры данных.

это чем? (не сталкивался никогда...)

[Сергей Соколов]

xmoonlight, ну, вариантов же полно: D3js, Processing, да что угодно. Если возможно формализовать каждое "дизайнерское" решение в процессе построения инфографики – значит, можно автоматизировать весь процесс.

[xmoonlight]

Сергей Соколов, а-а.. "Чистый" канвас - проще всего будет.
А про ссылки в иерархии - где теорию глянуть? Что-то не верится, что дизайн как-то связан с функционалом...

Answer 2

[Сергей Соколов]

Идея такая:

Реализация, конечно же, должна быть лучше. В идеале обойтись бы без цвета.

1. все точки разделены на 2 группы
Цветные / чёрные

2. каждая точка из группы 1 имеет 2 типа визуальных свойств, которых нет в группе 2
форма, цвет

3. весь ряд имеет одну точку акцента
доп контур

4. все точки в группе 2 имеют 3 уровня иерархии
дерево вниз

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