Dues Vestidures — Or i Plata
El tema es distribueix a totes les vistes a través de l'Environment, i canvia a l'instant. Cada vestidura es dissenya de manera diferenciada, incloent-hi l'estil de l'esfera, les busques i les xifres.
Or — Rellotge de Caça
Esmalt de lapislàtzuli blau fosc × xifres romanes en daurat (notació IIII) · emblema central de lluna creixent i estel de vuit puntes
Capsa gravada d'or envellit (llautó envellit). Una petita finestra amb la propera hora assenyalada a la posició de les 6
#8F7028
Lapislàtzuli #101838
Daurat #D9B45C
Or Lunar #F2DC96
tint #A67C2E
Plata — Rellotge de Ferrocarril
Esfera blanca · xifres aràbigues gruixudes · busques de bastó
La busca dels segons és vermella, seguint la tradició dels rellotges de ferrocarril
#9CA3AE
Porcellana Blanca #FAFAF7
Negre Ferro #1A1C22
Vermell #B02E2E
tint #44546A
Fixa l'hora amb les busques
No s'utilitza cap DatePicker. En lloc del gest de donar corda a la corona, l'hora del so es decideix arrossegant directament les busques de l'esfera. L'esfera de sota es pot arrossegar de debò.
Matí7:30
- Conversió: angle → hora — Les coordenades de l'arrossegament es converteixen en angle amb atan2, i es quantifiquen en passos de 6° per a la busca dels minuts i 30° per a la de les hores (convertit en la funció pura
ClockAngleMath, subjecta a proves). - Sincronització — En girar la busca dels minuts, la de les hores la segueix a 0,5°/min. En travessar el minut 0, avança o retrocedeix una hora (es determina pel salt 45→15 minuts).
- Tacte — A cada pas d'1 minut, .sensoryFeedback(.selection). Retorna al dit la sensació de clic d'un engranatge.
- Busca seleccionada — Es mostra un anell color llautó (pom) a la punta de la busca, indicant quina s'està movent.
- Confirmació — Es desa amb la placa «Fixa aquesta hora». Es converteix en Alarm.Schedule.relative d'AlarmKit.
La Terbolesa del Temps — Foscor Vespertina i Alba
Com més s'aprofundeix la nit, l'esfera es va enterbolint de blau violaci, com un receptacle d'ànima. A l'hora de l'alba, la llum purifica la terbolesa. A l'hora de la posta de sol, la constel·lació de l'estació sorgeix i brilla sobre l'esfera. Prova de recórrer un dia sencer amb el control lliscant de sota.
21:00Vespre
- Terbolesa — De les 16 h cap al vespre, un sediment blau violaci omple la vora de l'esfera, arribant al màxim entre les 23 h i les 4 h. Amb un degradat multicapa de mescla per multiplicació, el color ivori de fons s'enfonsa com «el fons d'un receptacle».
- Purificació de l'alba — Entre les 4 h i les 6 h, una llum des de dalt (composició en mode pantalla) dissol el sediment. El rellotge principal viu sempre aquest cicle, sincronitzat amb l'hora real.
- Constel·lació de l'estació — A la posta de sol (±2 hores) sorgeix en daurat la constel·lació de l'estació. Primavera = Lleó / Estiu = Escorpí / Tardor = Cassiopea / Hivern = Orió. De nit roman amb una lluïssor tènue.
- Implementació SwiftUI — El coeficient horari es calcula amb
TimelineView(.everyMinute), i es reflecteix en el dibuix per multiplicació/pantalla del Canvas i en l'opacitat del traçat de la constel·lació.
La Tapa de les Dotze Cases — l'Emblema de la Constel·lació Mensual
Al centre de la tapa hi ha encastat un esmalt de lapislàtzuli blau fosc, i cada vegada que canvia el mes, la casa (constel·lació) d'aquell mes es torna a gravar en or, acompanyada d'una lluna creixent i del nom tradicional del mes. La tapa del rellotge principal porta sempre l'emblema del mes actual.
Les Constel·lacions que Giren — · Els estels tenen profunditat i giren sense parar en l'espai. Si els acarícies per fer-los girar, adquireixen inèrcia
El to del disseny s'inspira en l'«esmalt de lapislàtzuli × or envellit» dels rellotges de butxaca antics (referència: design-refs/ref-watch.jpg). Les línies de les constel·lacions són una versió estilitzada i simplificada. A SwiftUI, l'emblema mensual es tria amb Calendar.current.component(.month), i es dibuixa en daurat sobre el Canvas.
Arcans — els Misteris de les Dotze Cases
Acaricia l'esfera dibuixant un cercle, i en cordar-la dotze voltes, l'encanteri es manifesta. De nit, els Arcans (12 tipus de les Dotze Cases); de dia, les Arts Solars (6 tipus); tancant la tapa, els Segells (6 tipus) — l'aplicació real n'ofereix 24 en tres sistemes. En aquesta pàgina en pots provar set, representatius de tots ells.
Encanteri en obrir la tapa
Encanteri en tancar la tapa (als Segells, en l'aplicació real)
L'hora del so (en activar-se la Campana Horària)
Quan arriba l'hora assenyalada, tota la pantalla parpelleja en daurat, i el cercle arcà es desplega amb la inscripció «L'hora assenyalada és arribada».
- Detecció del cordat — Es fa un seguiment de l'angle de rotació acumulat al voltant del centre de l'esfera; cada 2π es compta una volta. S'encenen els rombes del cercle arcà. Si es deixa 4 segons sense tocar, el cordat es dissipa.
- La Purificació de la Llum de l'Alba — Purifica la terbolesa amb llum. L'esfera transita forçosament a l'estat de l'alba, i un esclat daurat la recorre.
- La Tempesta de les Constel·lacions — La constel·lació de l'estació esclata en flames, i els estels es dispersen des del rellotge.
- El Retrocés del Temps — Les busques giren enrere a gran velocitat, i el cercle arcà gira en sentit invers.
- La Barrera del Llampec Porpra — Una resplendor blau-violeta i un impacte. El cercle arcà es torna porpra.
- La Flama Carmesina — Espurnes s'enlairen des del voltant del rellotge en un espai 3D (partícules amb projecció en perspectiva i tremolor).
- El Remolí de les Ones Blaves — Onades es propaguen sota els peus, i les esquitxades, atretes per la gravetat, dibuixen un arc.
- L'Anell del Vent Impetuós — Ratxes de vent giren envoltant el rellotge per davant i per darrere, i la seva pressió el fa vacil·lar.
- Implementació SwiftUI — La detecció de rotació és una acumulació d'
atan2(afegida a ClockAngleMath); els encanteris s'unifiquen sota el protocolSpellEffect, i la configuració de les ranures es desa a UserDefaults. En sonar, es detecta l'estat alerting d'AlarmKit i es desencadena la gran manifestació amb fullScreenCover.
Composició de Pantalles
L'Inici és sempre el rellotge. La llista, l'edició i el temporitzador es construeixen com a superfícies de treball a l'interior de la tapa, amb plaques gravades sobre el mateix drap de feltre.
Tu, desferma l'hora assenyalada
Propera hora assenyalada — demà a les 7:30 del matí
Prem llarg per canviar de tema
Inici (RootView)
Campana Horària
Matí7:30
Dies feiners · Ajornament 9 min
Matí9:00
Cap de setmana
Tarda10:15
Només un cop
Llista (AlarmListView)
Fixar l'hora
Matí7:30
Etiqueta — «Te del matí» · Ajornament 9 min
Fixa aquesta horaEdició (AlarmEditorView)
Temporitzador
Temporitzador (TimerView)
Live Activity / Dynamic Island
El temporitzador i el cronòmetre viuen a la pantalla de bloqueig i a la Dynamic Island. Amb un sol toc de llautó sobre fons negre, conserven l'essència del rellotge de butxaca fins i tot dins la interfície del sistema.
POCKETCHIME
Temporitzador del te
4:23
Pantalla de bloqueig — impulsada per Text(timerInterval:)
Dynamic Island (compacte) — l'esfera a l'esquerra, el temps restant a la dreta
Composició Tipogràfica i Color
La tipografia és la serif del sistema (New York / Hiragino Mincho). Els números es marquen amb xifres de mateixa amplada, i les etiquetes en lletres es presenten amb un espaiat ample, evocant una placa gravada.
10:09
Fixar l'hora
En obrir la tapa, comença el dia. Corda les busques, i espera l'hora.
RAILROAD GRADE · EST. 2026
| Drap de feltre (fons) | #24331F → #0B110A | |
| Tinta negra (text) | #EFE6CD | |
| Llautó (accent) | #C9A24B | |
| Escarlata (busca dels segons, avís) | #A03A2A | |
| Acer (tema plata) | #AEB6C2 |
| Disseny | Implementació (segons DESIGN.md) |
|---|---|
| Obertura i tancament de la tapa | rotation3DEffect(axis:(0,1,0), anchor:.leading) + spring 1.3s |
| Moviment de les busques | Impulsat contínuament amb TimelineView(.animation) |
| Arrossegament de les busques | ClockAngleMath (funció pura d'atan2, subjecta a proves unitàries) |
| Ajornament | secondaryButtonBehavior: .countdown + postAlert 9 min |
| Visualització del temps restant | Live Activity de AlarmAttributes<PocketWatchMetadata> |
| Propagació del tema | Coherent fins al Widget mitjançant tintColor i metadata.themeName |
