Нататкі распрацоўшчыка

Гісторыі і нататкі пра стварэнне FleaWinder — маленькага анімаванага цырку, які сілкуецца вашай клавіятурай і мышшу.

Завядзенне блох з любога месца на iOS

FleaWinder цяпер мае ўласную iOS-клавіятуру. Усталюйце яе адзін раз — і ў любой праграме, дзе вы друкуеце (Messages, Notes, Safari, дзе заўгодна), яна ціха завадзіць цырк у фоне. Кожныя дзесяць націскаў клавіш адпраўляюць выбух энергіі назад у асноўную праграму. Блохам усё роўна, адкуль ідзе ўвод — яны проста хочуць быць заведзенымі.

Сама клавіятура аформлена ў цыркавым стылі: цёмна-карычневыя клавішы, залатыя акцэнты на спецыяльных клавішах і маленькая шкала энергіі ўверсе, якая запаўняецца падчас друку. Яна змяняе колер з чырвонага на залаты і зялёны па меры росту лічыльніка. Побач — маленькі эмодзі-блыха і жывы лічыльнік, каб вы бачылі, колькі завядзення вы зрабілі за сесію.

Найскладнейшай часткай быў абмен данымі. Пашырэнні iOS-клавіятуры працуюць у сваім ізаляваным працэсе — яны не могуць размаўляць з асноўнай праграмай напрамую. Рашэнне — App Groups: агульны кантэйнер UserDefaults, да якога маюць доступ і клавіятура, і праграма. Клавіятура назапашвае ачкі завядзення і кідае іх у агульны кантэйнер; праграма забірае іх пры аднаўленні. Заадно мы перанеслі існуючыя Siri Shortcuts і інтэнты віджэтаў у той жа агульны кантэйнер, так што ўсё цяпер ідзе праз адну трубу.

Каб уключыць: Налады → Асноўныя → Клавіятура → Клавіятуры → Дадаць новую клавіятуру → FleaWinder Circus. Яна не запытвае Open Access — ніякай сеткі, ніякія даныя не пакідаюць вашу прыладу. Проста націскі клавіш, якія сілкуюць блох.

Цырк на маленькіх экранах

FleaWinder быў створаны для шырокай тонкай палоскі над панэллю задач — выгодна гарызантальнай. Тэлефоны — вертыкальныя. Зрабіць, каб цырк працаваў на маленькіх экранах, азначала пераасэнсаваць кампаноўку без страты таго, што робіць яго жывым.

Убудоўваемы віджэт на мабільных пераключаецца на высокі палатно, размяшчаючы нумары вертыкальна замест гарызантальнага расцягвання. Любы, хто ўбудоўвае FleaWinder у свой сайт, атрымлівае кампаноўку, якая адаптуецца аўтаматычна. Чатыры каляровыя прэсеты (цёмная, светлая, цёплая, халодная) і параметр маштабу дазваляюць убудаваць яго ў любое акружэнне.

Большай праблемай была чытальнасць. На экране тэлефона блохі, намаляваныя ў настольным маштабе — проста кропкі. Мы дадалі этап маштабавання, які павялічвае целы блох, каб іх касцюмы, выразы і аксесуары сапраўды чыталіся — паўзка Pip, шлем Rex, маленькая карона Blaze. Дэталі асобасці, якія заўсёды там былі, нарэшце чытаюцца на адлегласці выцягнутай рукі.

Астатняя частка мабільнай перапрацоўкі менш гламурная, але не менш важная: дружалюбныя да дотыку мішэні, лепшае маштабаванне шрыфтоў, адаптыўныя адступы па ўсім маркетынгавым сайце. Нічога рэвалюцыйнага — проста ўпэўненасць, што цырк выглядае правільна, дзе б вы яго ні знайшлі.

Касцюмы, сезоны і шпрэхшталмайстар

Гэты тыдзень быў пра візуальную глыбіню. Кожная блыха ў калоніі цяпер носіць унікальны касцюм — Nova мае парасольку на канаце, Rex носіць шлем у гармаце, Blaze атрымлівае карону для агнядышачнага нумару. Дробныя дэталі, але яны даюць кожнаму артысту ўласную ідэнтычнасць, якую можна ўбачыць з першага погляду.

Сама сцэна мяняецца з каляндаром. Сезонная сістэма часціц сыпле снег зімой, вішнёвыя квеціны вясной, святлячкі летам і лісце, якое кружыць, увосень. Ёсць таксама тонкі адценне дня/ночы, прывязаны да вашага рэальнага гадзінніка — палоска цяплее ў залатую гадзіну і цямнее пасля змяркання, з ярчэйшымі зоркамі ў начным небе.

Найбуйнейшае дапаўненне — шпрэхшталмайстар, спецыяльная блыха ў цыліндры, якая прагульваецца паміж нумарамі, інспектуючы шоу. Ён не выступае — ён кантралюе. Дабіцца правільнага маршруту яго патрулявання азначала разлічыць яго прагулкі так, каб ён прыходзіў якраз калі пераход паміж нумарамі заканчваецца, што дае ўсяму цырку адчуванне харэаграфіі, якога раней не было.

Пад капотам усё гэта цяпер забяспечвае поўная сістэма тэм. Восем каляровых палітр плюс рэжым аўтаматычнага сезону, які выбірае правільную палітру ў залежнасці ад месяца. Кожны колер у кожным нумары і элеменце інтэрфейсу бярэцца з актыўнай тэмы, таму пераключэнне адчуваецца бясшоўным, а не прыкручаным збоку.

v1.1.0: Два новыя нумары

Версія 1.1.0 дадае жангляванне і агнядыханне ў склад, даводзячы агульную колькасць да сямі жывых цыркавых нумароў. Абодва працуюць на той жа энергетычнай сістэме, якая рухае ўсім шоу — вашы націскі клавіш, рухі мышы і клікі.

Жанглёр адсочвае некалькі мячоў у сапраўдных параболах. Колькасць маштабуецца з энергіяй: два-тры ў спакоі, да шасці на поўнай магутнасці, з лоўлямі за спінай, калі публіка шалее. Дабіцца правільнага тайтмінгу запатрабавала раз'яднанне фаз кожнага мяча, каб яны не збіваліся ў купу.

Агнядышач выкарыстоўвае існуючую сістэму часціц, але з новым эфектам цеплавога мігацення. Даўжыня полымя расце з энергіяй, а клікі ствараюць бонусныя выбухі. Найскладнейшай часткай было змешванне колераў — плаўны пераход ад цёмна-чырвонага ля асновы да ярка-жоўтага на канчыку без палосчатасці.

Абодва нумары ўбудоўваюцца ў існуючую сістэму ратацыі, таму вы будзеце бачыць, як яны змяняюцца разам з арыгінальнай пяцёркай. Калі хочаце замацаваць любімы — панэль налад цяпер дазваляе ўключаць і выключаць асобныя нумары.

Гісторыя за старонкай гісторыі

Старонка гісторыі FleaWinder дакументуе больш за чатырыста гадоў сапраўдных блашыных цыркаў — ад мікраскопных малюнкаў Роберта Гука 1665 года да выканаўцаў на Октаберфесце, якія працуюць і сёння. Напісанне яе азначала чытанне віктарыянскіх афіш, аклічфраваных газетных вырэзак і здзіўляльнай колькасці навуковых прац пра энтамалагічную забаву.

Найцяжэйшым было вырашыць, што пакінуць за кадрам. Пра аднаго Луі Бертолота можна напісаць кнігу (і ён напісаў — некалькі, дарэчы). Кампраміс — храналогія, якая ахоплівае асноўныя моманты, і набор разгортваемых раздзелаў для тых, хто хоча паглыбіцца.

Старонка выкарыстоўвае буквіцы, дэкаратыўныя раздзяляльнікі і серыфны шрыфт, каб адлюстраваць шырокафарматныя друкі і афішы, якія яна апісвае. Кожны раздзел згорнуты па змаўчанні, каб не перагружаць чытача, але першы абзац заўсёды бачны з буквіцай, якая прыцягвае ўвагу.

Увесь тэкст даступны на англійскай, іспанскай і нямецкай мовах. Працэс перакладу выявіў цікавую мясцовую гісторыю — нямецкія традыцыі Flohzirkus на Октаберфесце, напрыклад, маюць сваю ўласную лінію, адрозную ад лонданскай і нью-ёркскай сцэн.

Чаму я стварыў FleaWinder

Я хацеў нешта, што робіць камп'ютар жывым — не адцягваючы ўвагу, а як ціхі кампаньён, які рэагуе на вашу прысутнасць. Большасць экранных застаўкак актывуюцца, калі вы сыходзіце; FleaWinder актывуецца, калі вы прыходзіце.

Ідэя была простай: узяць увесь невыкарыстаны ўвод, які ваша аперацыйная сістэма ігнаруе — рытм вашага набору, хуткасць мышы, каданс клікаў — і накарміць ім трупу анімаваных цыркавых блох. Чым больш вы працуеце, тым больш шоу ажывае.

Стварэнне яго як празрыстай накладкі над панэллю задач аказалася правільным абмежаваннем. Ён заўсёды бачны, але ніколі не перашкаджае. Вы не ўзаемадзейнічаеце з ім напрамую — вы проста працуеце, а ён рэагуе. Тэхнічная задача была зрабіць яго сапраўды празрыстым для клікаў, каб ён ніколі не забіраў фокус.

FleaWinder — гэта любоўны ліст да віктарыянскага блашынага цырку — сапраўднай, шматвяковай формы мастацтва, дзе гадзіннікары запрагалі сапраўдных блох цягнуць мініяцюрныя карэты і хадзіць па канатах. Старонка гісторыі расказвае гэту гісторыю поўнасцю.