Приче и белешке о изградњи FleaWinder-а — малог анимираног циркуса покренутог вашом тастатуром и мишем.
Циркус на малим екранима
FleaWinder је дизајниран за широку, танку траку изнад траке задатака — удобно пејзажно. Телефони су портретни. Прилагођавање циркуса малим екранима значило је преиспитивање распореда без губитка онога што га чини живим.
The embeddable widget flips to a tall canvas on mobile, stacking the acts vertically instead of spreading them across a ribbon. Anyone dropping FleaWinder into their own site gets a layout that adapts automatically. Four theme presets (dark, light, warm, cool) and a scale parameter let it blend with whatever surrounds it.
Већи изазов била је читљивост. На екрану телефона, буве нацртане у десктоп размери су само тачкице. Додали смо пропуст увећавања који повећава тела бува тако да су њихови костими, изрази и додаци заиста видљиви — Пипова трака за главу, Рексова кацига, Блејзова мала круна. Детаљи личности који су увек били ту одједном се читају на удаљености руке.
Остатак мобилне преправке био је мање гламурозан, али исто толико важан: тач-пријатељске мете за додир, боље скалирање фонтова, одговоран размак кроз цео маркетинг сајт. Ништа револуционарно — само осигуравање да циркус изгледа правилно где год га нађете.
Костими, сезоне и директор циркуса
Ова недеља била је потпуно посвећена визуелној дубини. Свака бува у колонији сада носи јединствен костим — Нова има парасол на жици, Рекс носи кацигу у топу, Блејз добија круну за тачку гутања ватре. Мали детаљи, али дају сваком извођачу идентитет који можете уочити на први поглед.
Сама бина се мења са календаром. Сезонски систем честица баца снег зими, трешњин цвет у пролеће, свитце лети и лишће које пада у јесен. Такође постоји суптилна нијанса дан/ноћ везана за ваш сат у стварном свету — трака се загрева у златном часу и затамњује после мрака, са светлијим звездама на ноћном небу.
Највећи додатак је директор циркуса — посебна бува у цилиндру која шета између тачака, инспектујући представу. Он не наступа; он надзире. Правилно постављање његове патролне путање значило је распоређивање његових шетњи тако да стигне тачно када се прелаз тачке заврши, што целом циркусу даје осећај кореографије који раније није имао.
Испод хаубе, потпуни систем тема сада покреће све ово. Осам палета боја плус аутоматски сезонски режим који бира праву на основу месеца. Свака боја у свакој тачки и UI елементу повлачи се из активне теме, тако да пребацивање изгледа беспрекорно а не накнадно додато.
v1.1.0: Две нове тачке
Верзија 1.1.0 додаје тачку жонглирања и гутача ватре на листу, доводећи укупан број на седам живих циркуских тачака. Обе раде на истом систему енергије који покреће остатак представе — ваши притисци тастера, покрети миша и кликови.
Жонглер прати више лопти у правим параболичним луковима. Број се скалира са енергијом: два или три у мировању, до шест при пуној снази, са хватањима иза леђа када публика полуди. Правилан тајминг захтевао је раздвајање фазе сваке лопте да се не гомилају.
Гутач ватре користи постојећи систем честица, али са новим ефектом треперења топлоте. Дужина пламена расте са енергијом, а кликови производе додатне рафале. Најтежи део било је мешање боја — глатки прелаз од тамноцрвене на бази до светложуте на врху без изгледа трака.
Обе тачке се уклапају у постојећи систем ротације, тако да ћете их видети како се смењују заједно са оригиналних пет. Ако желите да закачите омиљену, панел Подешавања вам сада омогућава да укључите и искључите појединачне тачке.
Историја иза странице историје
Страница историје FleaWinder-а документује преко четири стотине година правих буварских циркуса — од микроскопских скица Роберта Хука 1665. до извођача на Октоберфесту који и данас раде. Писање је значило читање викторијанских плаката, дигитализованих новинских исечака и изненађујуће великог броја академских радова о ентомолошкој забави.
Најтежи део био је одлучивање шта изоставити. Луј Бертолото сам би могао испунити књигу (и јесте — неколико, заправо). Компромис је била временска линија која погађа главне тачке и скуп проширивих одељака за свакога ко жели да копа дубље.
Страница користи украсна велика почетна слова, орнаменталне разделнике и сериф фонт да одзвања на широке листове и плакате које описује. Сваки одељак се подразумевано скупља тако да читалац није преоптерећен, али први параграф је увек видљив са украсним великим почетним словом да вас увуче.
Сав текст је доступан на енглеском, шпанском и немачком. Процес превођења открио је фасцинантну локалну историју — немачке Flohzirkus традиције на Октоберфесту, на пример, имају своју властиту линију различиту од лондонске и њујоршке сцене.
Зашто сам направио FleaWinder
Желео сам нешто што чини да се рачунар осећа живим — не на ометајући начин, већ као тихи сапутник који реагује на ваше присуство. Већина чувара екрана се активира када одете; FleaWinder се активира када дођете.
Идеја је била једноставна: узмите сав неискоришћени унос који ваш оперативни систем игнорише — ритам вашег куцања, брзину вашег миша, каденцу ваших кликова — и нахраните тим трупу анимираних циркуских бува. Што више радите, представа све више оживљава.
Изградња као транспарентног прекривача изнад траке задатака испоставила се као право ограничење. Увек је видљив, али никада не смета. Не интерагујете директно са њим; само радите, а он реагује. Технички изазов био је направити га стварно кликабилним кроз тако да никада не краде фокус.
FleaWinder је љубавно писмо викторијанском буварском циркусу — правом, вековном уметничком облику где су часовничари упрезали стварне буве да вуку минијатурне кочије и ходају по жици. Страница историје прича ту причу у целости.
