Notion
Bhuku rekunyorera rinodziya muzuva remasikati
Chimiro cheNotion chinotaridzika sebhuku remapepa rinodiwa masikati machena: kanivhasi inodziya, ine kirimu (#f6f5f4) inonzwa kunge inobata pane isina tsvina, ine mavara akawanda asina serif anopa huremu hwekunyora kune kopi yechigadzirwa, uye ruvara runoshandiswa sezviratidzo zvishoma—mapiritsi epeach anosimbisa zviito, bhuruu rimwe chete rinosimbisa chiito chikuru, uye mavara akasiyana-siyana anotenderera (koral, amber, sky, midnight) anopenda kumashure kwemakadhi semastika. Makadhi akarongwa pakanivhasi ine miganhu mitete nemakona—hapana mimvuri, hapana chrome—sezvikamu zvakaiswa mumutsetse zvekadhi reMoleskine. Mifananidzo inotamba uye ine springy, ine shanduko dzakapfava pa200ms uye mifananidzo yevatambi vane springy inomutsa hupenyu kune interface isina kushongedza.
Pakati, upamhi hwepamusoro hunogumira pa1440px. Chinhu chikuru idanda rakaiswa pakati: mutsara wezviratidzo → musoro mukuru une mitsara miviri une piritsi rine ruvara rwakaiswa mukati → musoro mudiki → mutsara une mabhatani maviri ekudaidzira chiito → mockup hombe yeUI yechigadzirwa. Pasi pechinhu chikuru, zvikamu zvinochinjana pakati pemagridi emakadhi machena nemapaneru ekuratidza mavara akazara. Rusvingo rwelogo igridi yemutsara mumwe chete yapakati yemalogo evabatsiri mugrayscale. Mabhuroko ebasa anoshandisa dhizaini yemakoramu maviri (mavara kuruboshwe, paneru ine mavara kurudyi), achichinjana kuruboshwe kuenda kurudyi pakati pezvikamu. Chikamu che "Bvunza vabatsiri vako kana uchida" chinoshandisa gridi yemakadhi e2x2, apo kadhi repamusoro rinotora upamhi hwakazara, uye mutsara wepasi wakakamurwa kuita makoramu maviri akaenzana. Magutter ari pakati pezvikamu akakura (~80px), achigadzira mutinhimira wakadzikama. Navigation ibhawa repamusoro rakagadzika re64px rine zvinhu zvekufamba zvakaiswa pakati uye mabhatani ekuita akarongwa kurudyi.
Mifananidzo inokosha, isina mapikicha. Mutauro wekuona wakavakirwa pazviratidzo zvakati sandara, zvine mifananidzo (mipendero yakatenderera ine mavara e2px), zvinhu zvekushongedza zvisina kujairika (zvidimbu zvinodhonzwa nemaoko, zvinopenya, miseve, maumbirwo emaruva), uye mockups ye user interface yechigadzirwa. Zviratidzo zvinoonekwa muhwindo guru semutsara wakataramuka wemaavatar manomwe uye zvakapararira papeji sezviratidzo zvinotamba. Mifananidzo yezvigadzirwa ndizvo chete zvinhu "zvechokwadi" zvinoonekwa: zvinoratidza iyo chaiyo Notion interface (mabhodhi eKanban, maonero emagwaro, mapaneru eAI agent) ane seti yakazara yezvinhu uye data rechokwadi. Mockup yechigadzirwa muhwindo guru yakakura, iri pakati, uye inoburitsa mumvuri mumwe chete unoiparadzanisa ne canvas. Hakuna mifananidzo yehupenyu, hapana mifananidzo yestock, hapana mifananidzo ye3D isina kujairika.
Palette
Rudzi
- Notion Blue
#0075de— Chinhu chikuru chinozadza bhatani rekuti call-to-action (CTA), izwi riri mu active navigation, mabhatani ekuti action akazadzwa ndiwo ega mavara ari musystem inenge monochrome yakazara zvakakwana kuti ionekwe se switch.
Kwakarerekera
- Paper Warmth
#f6f5f4— Kanivhasi yemapeji, kumashure kwehwindo guru, uye kumashure kwechikamu zvese zvine mavara anodziya, ane beige zvishoma anoita kuti system iite seyakafanana. - Pure White
#ffffff— Nzvimbo dzemakadhi, mapaneru akasimudzwa, kumashure kwechiratidzo, mavara akasiyana pamakadhi matema. - Ink Black
#000000— Rugwaro rukuru, malink ekufambisa, misoro - zvinoshandiswa nekujeka kwakasiyana (100%, 95%, 90%, 60%, 40%, 20%) kuvaka hutungamiriri pasina kuwedzera mavara matsva. - Charcoal
#111111— Sarudzo yemavara matema kunzvimbo dzeUI uko dema chairo ringaita serakaoma. - Stone
#757575— Rugwaro rwechipiri rwekufambisa, rugwaro rwekubatsira rwakadzimwa, mavara emabhatani akaremara - 60% inki alpha - Graphite
#615d59— Rugwaro rukuru rune toni inodziya - grey yebrownish, iyo inoenderana nemashure anodziya.
Kunyora
kubva pa12 kusvika pa96px · nhanho gumi
- NotionInter — kutsiva: Inter · marongero 400, 500, 600, 700 · Fonti huru isina-serif imhando ye geometric humanist ine hunhu husina kujeka, inoshandiswa pahukuru hwe400 pakunyora kwemuviri, 500 pakushandisa/kushandisa, uye 600-700 pamisoro. Chikero chefonti chinoshandisa aggressive negative letter spacing pahukuru hwakakura (-4.6px pa96px, -2px pa72px), izvo zvinoita kuti musoro wacho unzwe wakamanikana uye une chivimbo, pane kupenya.
- Lyon Text — kutsiva: Source Serif Pro · marongero 400 · Fonti yekunyora, yakachengeterwa zvikamu zvega zvechinyorwa chikuru uye sumo dzezvikamu, haishandiswi zvakanyanya (kana kana) kupa huremu hwekunyora, zvakafanana nechirevo chiri mumagazini. Inoshanda sechirevo chehurongwa kwete sehurongwa hwakafanana.
Zvikamu uye chimiro
| Chinangwa | Zvinoreva |
|---|---|
| Kuwanda kwevanhu | avhareji |
| Danho rekutanga | 8px |
| Radiyo yebhatani | 8px |
| Nharaunda yekadhi | 12px |
| Mimvuri | kwete - miganhu panzvimbo pemumvuri |
| Pakati pezvikamu | 80px |
| Upamhi hwepeji | 1440px |
AI ichavaka webhusaiti yako nenzira ye Notion uye ichaizadza
- Zadza nezvigadzirwa uye zvinyorwa uchishandisa chinongedzo - Instagram, TikTok, Facebook.
- Tumira zvirimo kubva pawebsite yako yekare—ingo taura kero yacho.
- Dhizaini yemazuva ano painjini yakanakisisa: React ( Next.js) ine server rendering uye SEO optimization zviri nyore.
- Kugadzirisa SEO otomatiki zvizere kuti uwane mhinduro dzekutsvaga uye mazano e neural network.
Mafashoni akafanana
- ElevenLabs — Rondedzero yemifananidzo ine mavara anodziya ane misoro midiki. Bhuku rekunyorera rakagadzirwa seBauhaus—pepa rine ruvara rwegoko remazai, inki nhema, uye ruvara rwepepuru neorenji chete rwekuratidzwa kwechigadzirwa.
- Awesomic — Mesh ye zinc ine zviratidzo zveorenji zvinoyeuchidza nezve confetti
- Monad — magazini yehunyanzvi yekunyora pamusoro peganda rinodziya
- Dub — Panera rekudzora repepa remupunga rakagadzirwa neLink
- Seline Analytics — Tafura yekuongorora yakanyarara papepa rinodziya
- Anthropic — Chinyorwa chesainzi pamusoro pemakwenzi anodziya emhando ye "vellum"—nzvimbo dzakadzikama dzenzou, misoro yenyaya dzakanyorwa, uye matauriro evhu rimwe chete anongoonekwa kana paine chikonzero chekuita chimwe chinhu.
- Calendly — Inki yebhuruu yakasviba padombo remabhura rinotonhora
- Augen Pro — Chiratidziro chechena cheApple chine ruvara rwebhuruu rwemagetsi, rusina huremu, sechinhu chinongoshandiswa chete munzvimbo ine ruvara rwemonochrome.
- Antimetal — Nyaya yekunyora pamusoro penyaya yekirimu—mangwanani akanyarara pamagazini yesainzi, uko kuzvidzora kunoratidza chivimbo uye varwi vanoita basa guru
- Perk — Lime yemagetsi papepa rinodziya reparchment
- Ditto — Nzvimbo yekuchengetera maruva emusango yakavhenekerwa nezuva. Nzvimbo dzinodziya dzekirimu, ruvara rweyero rinopenya, inki dzebhuruu dzakadzika, mavara emhando yeorganic ari kutumbuka seri kwechigadzirwa.
- Officevibe — Magazini yekunyora pamusoro pepepa rinodziya rakaita sekirimu. Fungidzira rondedzero ine pfungwa pamusoro pekutarisira HR, inounzwa sechigadzirwa—fonti yekunyora yakatsetseka ichizevezera kuburikidza neinterface yebhuruu yemazuva ano.