Я запилил анимацию для нового года. Что нужно изменить в первую очередь, чтобы стало лучше?

Question

[barkalov]

Ребят, некоммерческий проект, чисто по фану: snowtime.fun.
Сделал аудио-видео визуализацию для нового года, вместо гирлянды. Со звуком и сетью. Что стоит поменять в первую очередь, где по вашему главные косяки в UI. Насколько вообще работоспособно?
С наступающим!

PS: opensource, рекламы нет

Answer 1

[Рональд Макдональд]

Ну прикольненько, красиво, даже обгадить особо не за что. К тому же попенсорц, это огромная скидка даже для пару раз дёрганной прокрутки, а уж петросянить в текстах сам Б-г велел.

Comments

[barkalov]

Спасибо! А скроллинг где\когда именно дергается? Вначале, при появлении модального окна с кнопкой? Или вообще, в процессе?

[Рональд Макдональд]

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

[barkalov]

И ещё вопрос, если не сложно: вспыхивает и гаснет фон если крутить любой ползунок или только "Задержку звука". Если только задержку, то это не баг а фича - чтобы проще синхронизировать картинку со звуком. Если все ползунки - то баг. (

[Рональд Макдональд]

barkalov, не помню уже, я проверять - лень.

[barkalov]

В любом случае спасибо, буду чинить.

Answer 2

[hzzzzl]

по-моему офигенно, но я нечаянно что-то сломал



Uncaught TypeError: Cannot read property 'forced' of undefined
at HTMLDocument.click (script.js:315)

Comments

[hzzzzl]

сверху лучше бы сделать "табы" с аудио/графика/физика, а не три разных попапа, которые можно открыть одновременно один поверх другого :)

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

[barkalov]

Ого, спасибо! Такой ошибки я ещё не встречал. Буду разбираться.

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

[barkalov]

Вот ссылка непосредственно на javascript-исходник.

[hzzzzl]

barkalov, а ты крутой
тоже хочу взяться за сайт с "генеративной музыкой", типа как модулярные синты сами себя модулируют в одной тональности и в нужном темпе издают звуки, может быть мотивирует меня изучение кода :)

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

[barkalov]

Пасиб! Web audio API - довольно мощная и интересная штука. Я тоже хотел поэкспериментировать просто, думал состряпаю что-нибудь по-быстрому за насколько дней, но в результате сам увлекся. Как ребенок с игрушкой!

Трек из видоса очень приятный, играет до сих пор!

[barkalov]

Кстати, у вас интернет не от ТЕЛЕ2, случайно? Я кажется догадываюсь откуда ошибка. script.js - это не мой код, а то, что бесцеремонно вставляет провайдер (ТЕЛЕ2, как минимум) в код не-https страницы.

[hzzzzl]

barkalov, я в Риге, не теле2 :)

да! сейчас посмотрел подробнее, script.js это мое расширение для хрома, то есть это оно что-то наделало, сайт не причем

Answer 3

[auddit]

Это круто!
Раз уж вопрос в интерфейсах, то самое простое что можно сделать прямо сейчас - кнопку "На полный экран" зафиксировать, чтобы была видна всегда, а при клике на нее все настройки исчезают и прячутся в бутерброд, чтобы не было необходимости докручивать до "пустого экрана".
Ну то есть, пришел, настроил, сделал на весь экран и хорошо.

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

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

Для настройки цвета можно сделать авто режим, чтобы цвета менялись сами.

Comments

[barkalov]

По всем пунктам согласен с вами (ну может кроме сворачивания в бутерброд настроек при нажатии на "полный экран" - может сбить с толку, если сделать бесхитростно). В остальном вы правы, особенно насчет значка вопроса для открывания описания - очень логично же, и просто сделать. Сделаю обязательно!
Панель настроек справа - тоже правильная идея. Хотел обойтись без сайдбара и долго сопротивлялся (лишние сложности на мобильных экранах). Но вы правы.

Спасибо за советы!

PS: авторежим уже сделал, но пока пока убрал из релиза - получились слишком "роботизированные" движения.

[barkalov]

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