Notion
Daftari la karatasi lenye joto kwenye jua la mchana
Kiolesura cha Notion kinaonekana kama daftari la karatasi linalopendwa mchana kweupe: turubai ya joto na yenye krimu (#f6f5f4) ambayo huhisi kuguswa badala ya kuwa tasa, uchapaji mkarimu usio na serif unaotoa uzito wa uhariri kwa nakala ya bidhaa, na rangi inayotumika kama uakifishaji mdogo—vitenzi vya "vidonge" vya peach huangazia vitenzi, bluu moja hushikilia kitendo kikuu, na safu inayozunguka ya rangi za lafudhi (matumbawe, kaharabu, anga, usiku wa manane) hupaka rangi mandharinyuma ya kadi kama vibandiko. Kadi zimepangwa kwenye turubai yenye mipaka na pembe nyembamba—hakuna vivuli, hakuna kromu—kama sehemu zilizopangwa za daftari la Moleskine. Uhuishaji ni wa kucheza na wa chemchemi, wenye mabadiliko laini ya 200ms na uhuishaji wa wahusika wa chemchemi ambao huleta uhai kwenye kiolesura bila kuwa mapambo.
Ukiwa katikati, upana wa juu zaidi umepunguzwa hadi takriban pikseli 1440. Kipengele kikuu ni rundo la katikati: safu ya alama → kichwa kikubwa cha mistari miwili chenye kidonge cha rangi kilichopachikwa → kichwa kidogo → safu yenye vitufe viwili vya wito wa kuchukua hatua → mfano mkubwa wa kiolesura cha bidhaa. Chini ya kipengele kikuu, sehemu hubadilishana kati ya gridi za kadi nyeupe na paneli za lafudhi zenye rangi kamili. Ukuta wa nembo ni gridi ya safu moja katikati ya nembo za washirika katika rangi ya kijivu. Vizuizi vya vipengele vinatumia mpangilio wa safu mbili (maandishi upande wa kushoto, paneli yenye rangi kulia), ikibadilishana kushoto hadi kulia kati ya sehemu. Sehemu ya "Waulize wasaidizi wako wanapohitajika" hutumia gridi ya kadi ya 2x2, ambapo kadi ya juu inachukua upana kamili, na safu ya chini imegawanywa katika safu mbili sawa. Mifereji kati ya sehemu ni mingi (~pikseli 80), na kuunda mdundo wa wima tulivu. Usogezaji ni upau wa juu usiobadilika wa pikseli 64 wenye vipengele vya usogezaji katikati na vitufe vya kitendo vilivyopangwa kulia.
Vielelezo ni muhimu sana, bila picha. Lugha ya kuona imejengwa juu ya alama tambarare, zilizochorwa (kingo zilizozunguka katika miduara yenye rangi ya pikseli 2), vipengele vya mapambo dhahania (vipande vilivyochorwa kwa mkono, pambo, mishale, maumbo ya maua), na michoro ya kiolesura cha mtumiaji cha bidhaa. Alama hizo zinaonekana kwenye dirisha kuu kama safu mlalo ya avatari saba na zimetawanyika kwenye ukurasa kama alama za uakifishaji za kucheza. Picha za skrini za bidhaa ndizo vipengele pekee vya kuona "halisi": zinaonyesha kiolesura halisi cha Dhana (mbao za Kanban, mitazamo ya hati, paneli za wakala wa akili bandia) zenye seti kamili ya vipengele na data halisi. Mfano wa bidhaa kwenye dirisha kuu ni mkubwa, katikati, na hutoa kivuli kimoja kinachoitenganisha na turubai. Hakuna picha za mtindo wa maisha, hakuna picha za hisa, hakuna michoro dhahania ya 3D.
Paleti
Chapa
- Notion Blue
#0075de— Kipengele kikuu kinachojaza kitufe cha wito wa kuchukua hatua (CTA), lafudhi katika urambazaji unaotumika, vitufe vya kitendo vilivyojazwa ni mpango pekee wa rangi katika mfumo unaokaribia kuwa monokromu ambao umejaa vya kutosha kuonekana kama swichi.
Isiyoegemea upande wowote
- Paper Warmth
#f6f5f4— Turubai ya ukurasa, mandharinyuma ya dirisha kuu, na mandharinyuma ya sehemu zote ni rangi za joto na za beige kidogo zinazoipa mfumo hisia ya kugusa na ya analogi. - Pure White
#ffffff— Nyuso za kadi, paneli zilizoinuliwa, mandharinyuma ya nembo, maandishi tofauti kwenye kadi nyeusi. - Ink Black
#000000— Maandishi makuu, viungo vya urambazaji, vichwa vya habari - hutumika kwa uwazi tofauti (100%, 95%, 90%, 60%, 40%, 20%) ili kujenga mpangilio bila kuongeza rangi mpya. - Charcoal
#111111— Chaguo la maandishi meusi kwa maeneo ya UI ambapo rangi nyeusi kabisa ingeonekana kali sana. - Stone
#757575— Maandishi ya urambazaji wa pili, maandishi ya msaidizi yaliyozimwa, lebo za vitufe zilizozimwa - alfa ya wino ya 60% - Graphite
#615d59— Maandishi kuu yana sauti ya joto - kijivu cha hudhurungi, ambacho kinapatana na mandharinyuma ya joto.
Uchapaji
kutoka pikseli 12 hadi 96 · hatua 10
- NotionInter — mbadala: Inter · mihtasari 400, 500, 600, 700 · Fonti kuu ya sans-serif ni ya kibinadamu yenye umbo dogo, inayotumika katika ukubwa wa 400 kwa maandishi ya mwili, 500 kwa urambazaji/kiolesura cha mtumiaji, na 600-700 kwa vichwa vya habari. Kipimo cha fonti hutumia nafasi kali ya herufi hasi kwa ukubwa mkubwa (-4.6px kwa 96px, -2px kwa 72px), ambayo hufanya kichwa cha habari kihisi kikiwa kidogo na chenye ujasiri zaidi, badala ya kuwa chenye hewa.
- Lyon Text — mbadala: Source Serif Pro · mihtasari 400 · Fonti ya serif ya uhariri, iliyotengwa kwa ajili ya sehemu moja moja za maandishi kuu na utangulizi wa sehemu, hutumika kwa kiasi kidogo (mara nne) ili kuipatia herufi uzito wa fasihi, sawa na nukuu katika mpangilio wa gazeti. Inafanya kazi kama lafudhi ya kimfumo badala ya mpangilio sambamba.
Vipindi na umbo
| Kusudi | Maana |
|---|---|
| Uzito | wastani |
| Hatua ya msingi | 8px |
| Kipenyo cha kitufe | 8px |
| Redi ya kadi | 12px |
| Vivuli | hapana - mipaka badala ya vivuli |
| Kati ya sehemu | 80px |
| Upana wa ukurasa | 1440px |
AI itaunda tovuti yako kwa mtindo wa Notion na kuijaza
- Jaza bidhaa na machapisho kupitia kiungo - Instagram, TikTok, Facebook.
- Hamisha maudhui kutoka kwa tovuti yako ya zamani—taja tu anwani.
- Muundo wa kisasa kwenye injini bora: React ( Next.js) yenye utoaji wa seva na uboreshaji wa SEO bila kuchelewa.
- Uboreshaji wa SEO kiotomatiki kikamilifu kwa matokeo ya utafutaji na mapendekezo ya mtandao wa neva.
Mitindo inayofanana
- Mollie — Kaunta ya pesa taslimu, kitabu chenye leja nyeusi. Acha nafasi nyeupe ya kutosha kwa ajili ya muundo wa uhariri kuzunguka maandishi meusi, kisha ongeza nguvu kwenye sehemu zinazohusiana na bidhaa kwa krimu za joto, rangi za kahawia za espresso, na picha za kugusa za njia halisi za malipo.
- Kagi — Chumba tofauti cha kusomea. Tengeneza nafasi nyeupe iliyo wazi kuzunguka maandishi ya grafiti yenye herufi nzito, ukitumia lafudhi laini za zambarau na nyuso zenye joto za rangi ya waridi ili kuvunja utulivu.
- Milanote — Milanote ni studio ya ubunifu iliyojitolea. Unda kurasa za mtindo wa ghala la uhariri kwa kutumia mbao za kuona zinazoelea: kuta zenye fremu nyeusi, nafasi nyeupe ya kuonyesha, na picha za skrini zinazoonekana kama vitu halisi vyenye kina laini.
- Co2 — Atlasi ya hali ya hewa katika mwanga wa majira ya baridi kali. Unda kurasa kama mandhari ya hati ya angani, ambapo vichwa vya habari vya serif, data iliyo na kategoria, na picha zenye barafu huangazia pembezoni nyeupe pana.
- GitButler — Zambarau mwishoni mwa maandishi. Mchanganyiko wa vichwa vya habari vya serif vyenye utofauti mkubwa na gridi ndogo za kiufundi, nyuso za grafiti zenye joto, na lafudhi ya zumaridi isiyoonekana.
- ElevenLabs — Insha ya picha katika rangi ya krimu yenye umbo la kuvutia na vichwa vya habari hafifu. Daftari la mtindo wa Bauhaus—karatasi yenye rangi ya ganda la yai, wino mweusi, na lafudhi moja ya zambarau na chungwa kwa ajili ya kuonyesha bidhaa.
- Awesomic — Matundu ya zinki ya uhariri yenye alama za uakifishaji za rangi ya chungwa zinazokumbusha confetti
- Monad — jarida la kiufundi la uhariri kuhusu ngozi ya joto
- Dub — Paneli ya kudhibiti karatasi ya mchele isiyong'aa ya Link
- Seline Analytics — Jedwali la uchanganuzi tulivu kwenye karatasi ya joto
- Anthropic — Jarida la kisayansi kuhusu vellum yenye joto—nyuso tulivu za pembe za ndovu, vichwa vya habari vya uhariri vilivyoandikwa kwa ufupi, na lafudhi moja ya udongo inayoonekana tu wakati hatua inahitajika.
- Calendly — Wino wa bluu nyeusi kwenye marumaru baridi