• Приложение полностью бесплатное, нет рекламы и подписок;

• Приложение работает без интернета, и вообще ничего в интернет не отправляет;

• В дальнейшем никакая монетизация приложения не планируется, ну может быть какие-то донаты, если найдутся желающие.

Трекер называется ShowWeight - микс половины моей фамилии и слова "вес" на английском. К сожалению я протупил и не объединил две W в одну, чтобы получилось ShoWeight, возможно так было бы лучше, что уже поделать.

Если есть желающие затестить приложение - оно доступно в RuStore, не хотелось, конечно, ради такого мелкого ИИ проекта регистрироваться в Google Play, импакта никакого всё равно нет. Недавно как раз выпустил обновление, добавил некоторые прикольные штуки

Буду очень рад обратной связи по качеству приложения, в целом я считаю его законченным, оно умеет записывать вес и строить график, это самое главное. Всё остальное добавлялось исключительно в исследовательском интересе, хотелось понять на что способен агент Gemini, встроенный в Android Studio. Свои мысли по приложению можете оставлять здесь или в группе в ВК, ссыль на неё есть в самом приложении и здесь.

Я хотел не стерильную табличку speed/gear/rpm, а что-то ближе к электронным приборкам авто их 80х в смеси с современными технологиями: скорость, передача, TRIP A, RPM bar, мини-карта, маршрут, темный фон, цифры как на старой электронике. Такое, чтобы выглядело не как админка роутера, а как штука, которую кто-то прикрутил к машине в гараже в 2003 году и почему-то она работает.

Семисегментные цифры прямо в DOM

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

Это не самая сложная часть проекта, зато она очень влияет на настроение. Обычный текст говорит “это веб-страница”. Семисегментный индикатор говорит “добро пожаловать в странный автомобильный прибор”.

Семисегментные цифры приборки

const DASH_SEGMENTS = {
"0":"abcdef", "1":"bc", "2":"abged", "3":"abgcd",
"4":"fgbc", "5":"afgcd", "6":"afgecd", "7":"abc",
"8":"abcdefg", "9":"abfgcd", "-":"g", "N":"ceg", "R":"efgab"
};

function renderDashboardDigits(el, value, small=false){
const text = String(value ?? '0').toUpperCase().slice(0, 4);
el.innerHTML = '';

for(const ch of text){
const on = DASH_SEGMENTS[ch] || DASH_SEGMENTS[' '];
const digit = document.createElement('span');
digit.className = 'dashboardDigit' + (small ? ' small' : '');

for(const seg of ['a','b','c','d','e','f','g']){
const part = document.createElement('span');
part.className = 'dashboardDigitSeg s-' + seg + (on.includes(seg) ? ' on' : '');
digit.appendChild(part);
}
el.appendChild(digit);
}
}

RPM bar: маленькая полоска, много удовольствия

Обороты приходят из телеметрии. Максимальные обороты тоже могут прийти, но на всякий случай интерфейс умеет подстроиться под увиденный максимум. Полоса RPM собрана из 88 сегментов, последние сегменты помечены как red zone.

Здесь я окончательно понял, что приборка - это не про “показать число”. Это про ощущение. Когда шкала оборотов бежит рядом с рулем, мозг почему-то верит ей сильнее, чем сухому тексту.

RPM bar из 88 сегментов

function ensureDashboardRpmSegments(){
const track = document.getElementById('dashboardRpmTrack');
if(!track || dashboardRpmBuilt) return;

track.innerHTML = '';
dashboardRpmSegs = [];

for(let i = 0; i < 88; i++){
const seg = document.createElement('span');
seg.className = 'dashboardRpmSeg' + (i >= 76 ? ' red' : '');
track.appendChild(seg);
dashboardRpmSegs.push(seg);
}
dashboardRpmBuilt = true;
}

const ratio = clamp(rpm / Math.max(1000, dashboardLearnedMaxRpm), 0, 1);
const activeCount = Math.round(ratio * dashboardRpmSegs.length);

TRIP A: маленькая цифра, которая тоже пыталась сломаться

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

Если DistanceTraveled из телеметрии приходит нормально - используем его. Если он не двигается или приходит как бесполезный ноль - считаем расстояние сами, интегрируя скорость по времени. Это типичный момент разработки: хотел маленькую цифру, получил fallback-логику.

TRIP A с fallback-расчетом

function updateDashboardTrip(){
const rawDistance = Number(telemetry && telemetry.distance_traveled_m);
const rawValid = Number.isFinite(rawDistance) && rawDistance > 1;

if(rawValid){
if(dashboardTripRawBaseM === null || rawDistance + 5 < dashboardTripRawLastM){
dashboardTripRawBaseM = rawDistance;
}
dashboardTripRawLastM = rawDistance;
dashboardTripKm = Math.max(0, (rawDistance - dashboardTripRawBaseM) / 1000);
} else {
const dtMs = Math.max(0, Math.min(2500, now - dashboardTripLastAt));
const speedKmh = Math.max(0, Number(telemetry.speed_kmh) || 0);
dashboardTripKm += (speedKmh * dtMs) / 3600000;
}
}

Мини-карта в HUD: красиво, но телефон не надо жарить

В приборке есть мини-карта. Но ее нельзя было просто нарисовать как полноценную большую карту еще раз. Телефон должен держать нормальный FPS, не греться как кирпич и не превращать езду в презентацию PowerPoint.

Поэтому мини-карта живет на canvas, использует кэш тайлов и подбирает zoom по скорости. Чем быстрее едет машина, тем дальше навигатор должен смотреть вперед. На медленной скорости можно приблизить, на высокой - отодвинуть камеру, чтобы не ехать носом в край экрана.

Автоzoom мини-карты по скорости

function dashboardMiniDesiredZoom(mode, vw, vh, anchor, deg){
const kmh = Math.max(0, Number(telemetry.speed_kmh) || 0);
const lookSeconds = 4.5;
const lookMeters = Math.max(35, (kmh / 3.6) * lookSeconds);
const lookPx = mapPxFromMeters(lookMeters);
const ahead = dashboardForwardLookPoint(lookPx);

for(let z = MAX_ZOOM; z >= MIN_ZOOM; z--){
const v = viewFor(z);
const raw = {x: ahead.map_x * v.s - v.px, y: ahead.map_y * v.s - v.py};
const screen = rotatePointAround(raw.x, raw.y, anchor.x, anchor.y, deg);
if(screen.x >= sideMargin && screen.x <= vw - sideMargin &&
screen.y >= topMargin && screen.y <= vh - bottomMargin){
return z;
}
}
return MIN_ZOOM;
}

Мемный слой: когда телеметрия начинает шутить

Дальше случилось неизбежное. Если программа знает скорость, тормоз, вертикальную скорость и высоту, она может понимать игровые события. А если понимает события, может реагировать звуком.

Так появился мемный слой. Сэмплы лежат в папках samples/collision, samples/mega_fail_crash и samples/jump_takeoff. Сервер отдает список доступных звуков, телефон проигрывает случайный сэмпл при событии. Никакого облака, никакого сервиса, просто свои локальные файлы и браузер.

Настройки событий мемного слоя

MEME_EVENT_DEFAULTS = {
"mega_fail_crash": {
"window_sec": 0.15,
"min_previous_speed_kmh": 120.0,
"max_current_speed_kmh": 15.0,
"min_speed_drop_kmh": 100.0,
},
"collision": {
"window_sec": 0.5,
"min_speed_drop_kmh": 40.0,
"min_previous_speed_kmh": 60.0,
"max_brake_pct": 5.0,
},
"jump_takeoff": {
"detection_mode": "fast_freefall_confirmed",
"min_speed_kmh": 75.0,
"freefall_window_sec": 0.15,
"min_takeoff_vertical_speed_mps": 1.0,
"max_freefall_vertical_speed_mps": -0.25,
},
}

Столкновение - это не просто “скорость упала”

Самое важное для collision - не срабатывать на обычное торможение. Если игрок нажал тормоз, скорость упала, это не авария. Это водитель. Поэтому событие смотрит на падение скорости и одновременно проверяет, что тормоз почти не нажат.

Столкновение как резкое падение скорости без тормоза

if(collisionPast){
const drop = collisionPast.speed - speed;
const maxBrake = Number(collisionCfg.max_brake_pct ?? 5);
const noBrake = (brake <= maxBrake) && (Number(collisionPast.brake || 0) <= maxBrake);

if(noBrake &&
collisionPast.speed >= Number(collisionCfg.min_previous_speed_kmh || 60) &&
drop >= Number(collisionCfg.min_speed_drop_kmh || 40)){
playMemeEvent('collision');
return;
}
}

Прыжок - это не каждый холм

С прыжком было веселее. Нельзя просто сказать: машина поднялась вверх, значит прыжок. В игре есть холмы, эстакады, подъемы. Поэтому логика ждет не только рост высоты, но и признаки полета: вертикальную скорость, апекс, начало падения, небольшой drop from apex. По сути, нужно поймать момент “машина реально оторвалась”, а не “дорога пошла вверх”.

Прыжок как подтвержденный полет, а не просто подъем

const takeoffOk =
(recentMaxVy >= minTakeoffVy) ||
(verticalSpeedGain >= minVyGain) ||
(recentRise >= minRise && recentMaxVy >= minTakeoffVy * .55);

const fallingOk =
(fallingSamples.length >= minFallSamples || Number(vy) <= fallingLimit) &&
(fallDuration >= minFallDuration || confirmDrop >= minApexDrop * .55) &&
accelOk;

if(takeoffOk && fallingOk && notRoadSlope && dropFromApex >= minApexDrop){
playMemeEvent('jump_takeoff');
}

Что получилось в итоге

На этом этапе проект перестал быть “просто картой на телефоне”. Он стал companion app:

- основной слой - позиция машины и карта;
- навигационный слой - route, distance, heading-up, reroute;
- приборный слой - speed, gear, rpm, TRIP A, мини-карта;
- event layer - столкновения, прыжки, mega fail и звуковые реакции;
- будущий слой - Z-логгер для развязок и уточнение 3D-логики маршрутов.

И самое смешное: все это началось с очень простой мысли “хочу убрать мини-карту из игры и не потеряться”.

Я надеюсь, что вдохновение ко мне вернётся, и я сделаю что-то подобное для другой игры (напишите, кстати, какую игру еще можно было попробовать также снабдить навигатором?), или ещё что нибудь. Спасибо, что читали и ставили плюсы, всем добра!

С чего всё началось?

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

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

23 мая этого года мне исполнилось 35 лет, и я решил попробовать что-то новое для себя. У меня была подписка на ChatGPT, и мне стало интересно узнать, как работает Codex. Изначально не было цели делать суфлёр или что-то подобное, но одна из первых идей, которые пришла в голову, сделать приложение, которое может помогать во время выступлений, почему бы и нет.

Раньше я пробовал несколько известных приложений в рамках домашних репетиций, иногда опыт на старте был неплохим, но потом начинались разные штуки, вроде «купите подписку, чтобы сохранять песни офлайн, добавить больше песен, собрать избранное. И как-то желание пользоваться этими штуками отпадало. А ещё, во многие нельзя добавить свои песни. Для меня, как автора, это тоже было важно.

Вайб-кодинг

Итак, мне 35, я открываю ChatGPT и просто спрашиваю, а что такое Codex, а можно ли написать с ним приложение на Android, а что, если это будет, например суфлёр для музыкантов?

Через 15 минут у меня был первый «прототип» приложения. Криво, косо, но работает. И меня это очень впечатлило. Я не написал ни строчки кода и получил рабочую вещь! Да ладно?!

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

Разработка

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

В процессе оказалось, что 6000 строк кода в MainActivity это не очень и как будто бы надо с этим что-то делать. И начался рефакторинг. Огромная трудоёмкая работа, полезная… результаты которой не увидит практически никто. Зато в последствии это дало больше свободы в работе – стало не так страшно что-то менять, добавлять новые функции, заниматься дизайном, а после редизайном приложения.

Философия

Также, в процессе работы, начала, простите за громкое слово, проявляться философия проекта. Например, базой для себя я решил сделать offline-first и мысль о том, что «Всё уже у тебя». Локации для выступлений могут быть очень разными, в том числе бары в подвалах, загородные дома и дачи. Даже парковка! Поэтому очень важно, чтобы твой репертуар всегда был тебе доступен. Даже если ты не в «труднодоступном» месте, никто не застрахован от падения интернета.

Следующие основополагающие принципы пошли из базового. Например, аккаунты оффлайн-приложению, по сути, не нужны. Есть твоё приложение и песни в нём. Чего ещё желать?

А вот отсутствие подписки – немного другая история. Да это выливается из offline-first. Но, я считаю, что твой суфлёр – это такой же инструмент, как тюнер и каподастр. И мне не нравится идея того, что каждый месяц тебе продают одно и то же приложение, твои песни и твою работу, проделанную с ними. Никто не платит за молоток каждый месяц просто для того, чтобы им владеть. Инструменты рулят, долой сервисы!

Поэтому, база приложения:

- Музыкант важнее, чем технология. Приложение должно помогать, а не управлять и командовать;
- Инструмент, а не сервис;
- Офлайн в первую очередь, регистрации не нужны, вся работа пользователя принадлежит пользователю;
- Нет функциям ради функций, надёжность важнее;
- Никаких лишних и подозрительных разрешений;
- Интерфейс должен быть простым, не отвлекать, не давить;

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

Функции

Давайте рассмотрим приложение поближе. В самом начале появились библиотека, редактор текста с аккордами, транспонирование и сценический режим – наш основной рабочий экран. А ещё, на ранней стадии появился «умный» перенос строк, для того чтобы адекватно перенести аккорды и текст при большом размере шрифта. То, что надо для людей со слабым зрением (меня, например).

Вернёмся к погоне за точностью. Я добавил функцию прокрутки по приблизительной длительности песни, она повышала точность, но всё равно была не идеальна. Поэтому я стал думать, как ещё можно повысить точность? Я решил, что в тексты можно закидывать своеобразные якоря-чекпоинты. И тогда родилась одна из функций, которые, можно сказать, является фишкой приложения – Карта песни. С помощью неё можно настроить, в какой момент времени определённый блок песни проходит через фокусную зону - ещё одно изобретение для комфортного чтения текста. Собственно, та самая ситуация, когда текст тебе не нужен постоянно, но может быть нужен только в определённый момент. И он там будет!

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

А ещё, в нём есть метроном. Просто факт. Потому что это была просьба первого человека, который воспользовался приложением. Сначала я сделал его через tone generator, звучало как будто кто-то ритмично нажимает кнопки на телефоне. В последствии, был улучшен с помощью двух звуков деревянного блока – один клик и один акцент, благодаря этому можно ввести любые ритмические рисунки, но пока в нём только 3/4 и 4/4.

А ещё, по просьбе пользователя появилась функция «Галя, у нас отмена!» в редакторе текстов. Раньше если ты ошибся, то ты ошибся, но теперь всегда можно откатиться. Удивительно, но я не замечал этого простого недостатка уровня слона... потому что пользовался импортом своих подготовленных файлов из txt.

Что произошло за месяц

На текущий момент идёт второй месяц разработки. И я понял, что вайб-кодинг значительно упрощает работу, при условии, что вы знаете над чем работаете. А вот разработка в целом – не настолько простая вещь. За этот период я успел попробовать себя в роли продакт-менеджера, UX/UI-дизайнера, архитектора, тестировщика, технического писателя, аналитика, маркетолога, бренд-стратега, SMM-щика, копирайтера, комьюнити-менеджера, специалиста по публикации приложений, исследователя конкурентов и иногда — психолога собственного проекта. В общем, за короткий период я, можно сказать, прошёл практический курс по продуктовой разработке. А ещё, поверил в то, что можно делать хорошие вещи не только для себя.

Что дальше

К чему дальше движется проект StageLyrics? Сейчас я пытаюсь разобраться с регистрацией в Google Play Console, но несмотря на это, я считаю, что приложение должно быть доступным. Поэтому, если я и осилю этот этап, возможность скачать apk бесплатно останется, а покупка в приложении будет просто способом отблагодарить автора. А ещё, можно отблагодарить добрым словом, честным отзывом или сообщением о баге. Также, думаю о локализации.

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

Финал

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

"Извинитес, это телеграм"

Если вам интересно скачать приложение и познакомиться с ним, следить за судьбой проекта или просто поддержать «присутствием», можете вступить в тг-чат приложения t.me/stagelyrics

Если хотите просто познакомиться с приложением, но не заходить в тг-чат, я подготовил альтернативные варианты – Яндекс Диск и Google Drive:

Яндекс: https://disk.yandex.ru/d/b84KKMClTOo_gg

Google: https://drive.google.com/file/d/1VqerprHKF8UHM_1zyUPdt-WH5KC...

Почему не GitHub? Честно, я пока ещё не умею, но, надеюсь, что и с этим справлюсь!

Спасибо за ваше внимание! И если StageLyrics поможет хотя бы нескольким музыкантам чувствовать себя спокойнее на сцене — значит, всё это время прошло не зря.

P.S. Маленький бонус, я сделал небольшой demopack, чтобы вы могли без труда посмотреть функционал. Внутри песни из моего сольного проекта с настроенными картами, вы можете открыть песню на любой площадке и посмотреть, насколько точно работает синхронизация. Загрузить demopack можно с помощью импорта резервной копии в настройках приложения.

P.P.S. Это моё первое приложение, но, надеюсь, что не последнее

• можно создать несколько зон;

• перетащить зону куда удобно;

• растянуть за угол;

• выбрать действие;

• поставить пресет;

• очистить всё и вернуться к обычной схеме.

Из действий есть листание вперёд/назад, меню, закладки, оглавление, яркость плюс/минус, TTS, выход из приложения и “ничего”.

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

Отдельно пришлось решать пересечения.

Например, можно сделать большую зону “вперёд” почти на весь правый край, а поверх неё маленькую зону “меню” в углу. Тогда возникает вопрос: если тап попал сразу в обе зоны, кто победил?

Я сделал правило простым: побеждает меньшая зона. Обычно маленькую область ставишь специально, а большая работает как фон.

Самая неприятная часть была не в математике прямоугольников, а в жестах.

В Compose зона могла начать перетаскиваться, потом интерфейс пересобирался, pointerInput перезапускался, и drag срывался прямо во время движения. Визуально это выглядело так, будто блок просто отлип от пальца.

Починилось через стабильные ключи для зон. Без key Compose начинал путать элементы при изменении порядка отрисовки, особенно когда выбранная зона поднималась поверх остальных.

В итоге фича получается больше, чем я ожидал. Не просто «тап слева/справа», а маленький редактор управления чтением. Выйдет в следующем обновлении.

Параллельно в последних версиях уже завезено: полка «Читаю», дробные проценты прогресса, PDF-фильтры, кроп, контраст, настройка карточек в библиотеке и фиксы для больших библиотек.

Но тап-зоны сейчас, наверное, самая заметная штука именно в интерфейсе чтения.

MRead бесплатный, без рекламы. GitHub использую как страницу релизов: APK, changelog и контрольные суммы.

Скачать, посмотреть changelog и закинуть баг/идею удобнее всего через канал - там же все ссылки на сторы в закрепе:

https://t.me/mread_app

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