Subframe
ചൂടുള്ള കടലാസിൽ ഒരു ഗ്രാഫിക് ഡ്രോയിംഗ്. ഓരോ സ്ട്രോക്കും ഗ്രാഫൈറ്റോ ഇറേസറോ ഉപയോഗിച്ച് വരയ്ക്കുന്ന ഡിസൈനർ പേപ്പർ, ഒരിക്കലും പെയിന്റ് ചെയ്യരുത് - വരകളുടെ കനവും സ്പാർസ് സെരിഫുകളും വഴിയാണ് ആഴം കൈവരിക്കുന്നത്.
സബ്ഫ്രെയിം ഒരു മോണോക്രോം ഡിസൈനറുടെ വർക്ക്സ്പെയ്സാണ്: ഊഷ്മളമായ, ക്രീമി നിറമുള്ള ക്യാൻവാസ്, ഗ്രാഫൈറ്റ്-കറുത്ത മഷി, ക്രോമാറ്റിക് ആക്സന്റുകളുടെ പൂർണ്ണ അഭാവം. മുഴുവൻ ഇന്റർഫേസും പേപ്പർ, പെൻസിൽ, ഷാഡോ എന്നിങ്ങനെ ഒരൊറ്റ മെറ്റീരിയലായി കാണപ്പെടുന്നു - ഒരു ബോൾഡ് ടൈപ്പോഗ്രാഫിക് ടച്ച് ഉപയോഗിച്ച്: ഒരു സിസ്റ്റമാറ്റിക് സാൻസ്-സെരിഫിനെതിരെ (ഇന്റർ) സജ്ജീകരിച്ചിരിക്കുന്ന ഒരു പരിഷ്കരിച്ച സെരിഫ് (ഇൻസ്ട്രുമെന്റ് സെരിഫ്), ഇത് തലക്കെട്ടുകൾക്ക് എഡിറ്റോറിയൽ ഗുരുത്വാകർഷണം നൽകുന്നു. ഉപരിതലങ്ങൾ ഉയർത്തുന്നതിനുപകരം പരന്നതും ഫ്രെയിം ചെയ്തതുമാണ്; #e5e7eb-ലെ നേർത്ത ഡിവൈഡറുകളിലൂടെയും ഷാഡോകൾക്ക് പകരം ഇരുണ്ട നിയന്ത്രണങ്ങളിൽ ഹൈലൈറ്റുകൾ ഉൾപ്പെടുത്തുന്നതിലൂടെയും ആഴം കൈവരിക്കുന്നു. സാന്ദ്രത ഉദാരമാണ്: വിശാലമായ ലംബ താളം (വിഭാഗങ്ങൾക്കിടയിലുള്ള 48–64px വിടവുകൾ), കേന്ദ്രീകൃതമായ, പൂർണ്ണ വീതിയുള്ള ലേഔട്ടുകൾ, വാചകത്തിന് ചുറ്റുമുള്ള വിശാലമായ വൈറ്റ്സ്പെയ്സ്. വെളുത്ത നിറത്തിനും കറുപ്പ് നിറത്തിനും ഇടയിലുള്ള വ്യത്യാസം മാത്രമാണ് ഏക നിറം, ഇത് ഇരുണ്ട ബട്ടണിനെ ഓരോ പേജിലും ഏറ്റവും ശ്രദ്ധേയമായ ഘടകമാക്കുന്നു, ചാരനിറത്തിലുള്ള ടോണുകളിലുള്ള പങ്കാളി ബ്രാൻഡ് ലോഗോകളുടെ സ്ട്രിപ്പ് മാത്രമാണ് അലങ്കാര ദൃശ്യ ഘടകമാക്കുന്നത്.
മധ്യഭാഗത്തുള്ള, പൂർണ്ണ വീതിയുള്ള ലേഔട്ടുകൾ (1200px) ഉദാരമായ ലംബ താളത്തോടെ. പ്രധാന ഘടകം ഒരു ഒറ്റ, മധ്യഭാഗത്തുള്ള ബ്ലോക്കാണ്: മുകളിൽ ഒരു ഇരുണ്ട, സെഗ്മെന്റഡ് നിയന്ത്രണം, ഒരു വലിയ "ഇന്റർ" തലക്കെട്ട്, ഒരു ഒറ്റ-വരി ഉപതലക്കെട്ട്, രണ്ട് അടുത്തുള്ള ബട്ടണുകൾ (പൂരിപ്പിച്ച + അർദ്ധസുതാര്യ)—സൈഡ് ഇമേജ് ഇല്ല, ലേഔട്ട് ബ്രേക്കപ്പ് ഇല്ല. പ്രധാന ഘടകത്തിന് താഴെ ഒരു കേന്ദ്രീകൃത ഗ്രേസ്കെയിൽ ലോഗോ സ്ട്രൈപ്പ് ഉണ്ട്. തുടർന്നുള്ള ഓരോ വിഭാഗവും ഒരേ പാറ്റേൺ പിന്തുടരുന്നു: ഇടത്തേക്ക് വിന്യസിച്ച ശീർഷകവും ഉപതലക്കെട്ട് ബ്ലോക്കും, തുടർന്ന് വിഭാഗങ്ങൾക്കിടയിൽ 48–64px ഗട്ടർ സ്പെയ്സുള്ള ഒരു പൂർണ്ണ വീതിയുള്ള ഉൽപ്പന്ന ഷോകേസ് ഫ്രെയിം. നാവിഗേഷൻ വളരെ കുറവാണ്: കേന്ദ്രീകൃത ലിങ്കുകളും വലതുവശത്ത് വിന്യസിച്ച പ്രവർത്തനങ്ങളും ഉള്ള ഒരു മുകളിലെ ബാർ, സൈഡ്ബാർ ഇല്ല, മെഗാ-മെനു ഇല്ല. പേജ് മുകളിൽ നിന്ന് താഴേക്ക് കേന്ദ്രീകൃത പ്രസ്താവനകളുടെ ഒരു പരമ്പരയായി വായിക്കുന്നു, ഓരോന്നിനും മതിയായ ഇടം നൽകിയിരിക്കുന്നു - ലേഔട്ട് ഒരു തിരക്കേറിയ ഉൽപ്പന്ന പേജിനേക്കാൾ ഒരു എഡിറ്റോറിയൽ പോർട്ട്ഫോളിയോ പോലെയാണ് തോന്നുന്നത്.
വിഷ്വൽ ഡിസൈൻ മിനിമലിസ്റ്റും പ്രവർത്തനപരവുമാണ്. സിസ്റ്റം രണ്ട് വിഷ്വൽ മോഡുകൾ ഉപയോഗിക്കുന്നു: (1) ഫ്രെയിം ചെയ്ത ഉൽപ്പന്ന സ്ക്രീൻഷോട്ടുകളും 24px-റേഡിയസ് ഫ്രെയിമുകളിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്ന UI മോക്കപ്പുകളും—അവ ഒരേ മോണോക്രോം പാലറ്റിൽ റെൻഡർ ചെയ്തിരിക്കുന്ന യഥാർത്ഥ ഇന്റർഫേസ് ഘടകങ്ങൾ (പട്ടികകൾ, ബട്ടണുകൾ, ഫോമുകൾ) പ്രദർശിപ്പിക്കുന്നു, സ്ക്രീൻഷോട്ടുകൾ പേജിൽ സുഗമമായി സംയോജിപ്പിച്ചിരിക്കുന്നതായി ദൃശ്യമാക്കുന്നു; (2) ഗ്രേസ്കെയിൽ പങ്കാളി ലോഗോകളുടെ ഒരു സ്ട്രിപ്പ് സോഷ്യൽ പ്രൂഫായി വർത്തിക്കുന്നു, നിറമോ കണ്ടെയ്നറുകളോ ഇല്ലാതെ ഫ്ലാറ്റ് റെൻഡർ ചെയ്തിരിക്കുന്നു. ജീവിതശൈലി ഫോട്ടോകളോ അമൂർത്ത ഗ്രേഡിയന്റുകളോ 3D റെൻഡറുകളോ ഇല്ല. ബ്രാൻഡ് ഐക്കണുള്ള ചൂടുള്ള ചാരനിറത്തിലുള്ള പശ്ചാത്തലത്തിൽ കേന്ദ്രീകരിച്ചിരിക്കുന്ന ഇരുണ്ട ഉൽപ്പന്ന "ടൈൽ" മാത്രമാണ് ചിത്രീകരണ ഘടകം - ഇത് ഒരു ഉൽപ്പന്ന പ്രദർശനമായിട്ടല്ല, അലങ്കാരമായി കണക്കാക്കപ്പെടുന്നു. എല്ലാ ചിത്രങ്ങളും ഒരു ടെക്സ്റ്റ് അധിഷ്ഠിത ലേഔട്ട് ഉൾക്കൊള്ളുന്നു, അവിടെ ദൃശ്യ ഭാരം വാചകം വഹിക്കുന്നു.
പാലറ്റ്
നിഷ്പക്ഷം
- Page Canvas
#fafafa— പേജ് പശ്ചാത്തലം, ക്യാൻവാസിലെ പോസ്റ്റ്കാർഡ്, ഇരുണ്ട പ്രതലങ്ങളിലെ ഇളം വാചകം - മുഴുവൻ മോണോക്രോം സിസ്റ്റത്തിനും അടിസ്ഥാനമായ ഒരു ചൂടുള്ള വെളുത്ത നിറം. - Hairline Border
#e5e7eb— സിസ്റ്റത്തിൽ ഏറ്റവും കൂടുതൽ ഉപയോഗിക്കുന്ന ഔട്ട്ലൈൻ തരം ആയ ഡിവൈഡറുകൾ, കാർഡ് ബോർഡറുകൾ, ഇമേജ് ഫ്രെയിമുകൾ, ഐക്കൺ ഔട്ട്ലൈനുകൾ എന്നിവ സ്പേഷ്യൽ ഘടനയെ നിർവചിക്കുന്നു. - Card Surface
#ededed— കാർഡുകൾക്കായുള്ള ഉയർത്തിയ പശ്ചാത്തലം, ഒരു അധിക ഉപരിതലം - ക്യാൻവാസിൽ നിന്ന് ഒരു പടി മുകളിൽ സ്ഥിതിചെയ്യുന്നു, നിഴലുകളില്ലാതെ ഒരു ഗ്രൂപ്പിംഗ് സൃഷ്ടിക്കുന്നു. - Divider Mid
#dadada— മിഡ്ടോൺ ഡിവൈഡറുകളും വിഭാഗങ്ങൾക്കിടയിലുള്ള സംക്രമണങ്ങളും - Graphite
#242424— ലൈറ്റ് പ്രതലങ്ങളിലെ പ്രൈമറി ബട്ടണുകൾക്കുള്ള ഉയർന്ന ദൃശ്യതീവ്രത ന്യൂട്രൽ ഫിൽ. - Ink Black
#171717— ബോഡി ടെക്സ്റ്റ്, ഹെഡിംഗ്സ്, ഐക്കൺ ഔട്ട്ലൈനുകൾ - ഗ്രാഫൈറ്റിനേക്കാൾ അൽപ്പം തണുത്തതാണ്, പ്രതലങ്ങളേക്കാൾ ടൈപ്പോഗ്രാഫിക്ക് ഉപയോഗിക്കുന്നു.
ടൈപ്പോഗ്രാഫി
12 മുതൽ 128px വരെ · 7 ചുവടുകൾ
- Inter — മാറ്റിസ്ഥാപിക്കൽ: Inter (Google Fonts) · രൂപരേഖകൾ 500, 600, 700 · ഒരു സാൻസ്-സെരിഫ് സിസ്റ്റം ഇന്റർഫേസ് - നാവിഗേഷൻ, ബോഡി ടെക്സ്റ്റ്, ബട്ടണുകൾ, ഉപതലക്കെട്ടുകൾ, സെക്ഷൻ ഹെഡിംഗുകൾ. ഭാരം: ബോഡി ടെക്സ്റ്റിനും നിയന്ത്രണങ്ങൾക്കും 500, ഉപതലക്കെട്ടുകൾക്കും നാവിഗേഷൻ ആക്സന്റുകൾക്കും 600, സെക്ഷൻ ഹെഡിംഗുകൾക്ക് 700. ശക്തമായ നെഗറ്റീവ് ലെറ്റർ സ്പെയ്സിംഗ് ഏത് വലുപ്പത്തിലും ജ്യാമിതീയ രൂപങ്ങൾ കംപ്രസ് ചെയ്യുന്നു, ഇത് ഇന്റർഫേസിന് ഒരു സംക്ഷിപ്ത സാങ്കേതിക രൂപം നൽകുന്നു.
- Instrument Serif — മാറ്റിസ്ഥാപിക്കൽ: Playfair Display · രൂപരേഖകൾ 400 · തലക്കെട്ടുകൾക്കും എഡിറ്റോറിയൽ ഉള്ളടക്കത്തിനും മാത്രമായി രൂപകൽപ്പന ചെയ്തിരിക്കുന്ന ഒരു സെരിഫ് ടൈപ്പ്ഫേസ്. ഇതിന്റെ 400 ഭാരവും -0.025em അക്ഷരങ്ങളുടെ അകലവും ഇന്ററിന്റെ വ്യാവസായിക ജ്യാമിതിയുമായി വ്യത്യാസമുള്ള ഒരു മനോഹരവും ഇറ്റാലിക് ചെയ്തതുമായ രൂപം സൃഷ്ടിക്കുന്നു - ഒരു സിഗ്നേച്ചർ ടെക്നിക്: ഒരു സാൻസ്-സെരിഫ് പേജിനുള്ളിൽ ഒരൊറ്റ സെരിഫ് വാക്കോ വാക്യമോ, ഒരു തലക്കെട്ട് ശൈലിക്ക് പകരം വിഷ്വൽ ചിഹ്നനമായി പ്രവർത്തിക്കുന്നു.
- Fragment Mono — മാറ്റിസ്ഥാപിക്കൽ: JetBrains Mono · രൂപരേഖകൾ 400 · ഇൻലൈൻ കോഡ് പോലുള്ള ഘടകങ്ങൾ, ടാഗ് ലേബലുകൾ, സാങ്കേതിക കോൾഔട്ടുകൾ എന്നിവയ്ക്കുള്ള ആക്സന്റ് മോണോ. വളരെ കുറച്ച് മാത്രമേ ഉപയോഗിക്കുന്നുള്ളൂ, ഫംഗ്ഷൻ ലിസ്റ്റുകളിലും ഇൻലൈൻ അനോട്ടേഷനുകളിലും ഇത് ദൃശ്യമാകുന്നു, അവിടെ ഡിസൈൻ ടൂൾ "ഇത് മെഷീൻ ഔട്ട്പുട്ടാണ്" എന്ന് സൂചിപ്പിക്കാൻ ആഗ്രഹിക്കുന്നു.
ഇടവേളകളും രൂപവും
| ഉദ്ദേശ്യം | അർത്ഥം |
|---|---|
| സാന്ദ്രത | ശരാശരി |
| അടിസ്ഥാന ഘട്ടം | 8px |
| ബട്ടൺ ആരം | 16px |
| കാർഡ് ആരം | 24px |
| ഷാഡോകൾ | ഷാഡോകൾക്ക് പകരം ബോർഡറുകൾ ഇല്ല |
| വിഭാഗങ്ങൾക്കിടയിൽ | 64px |
| പേജ് വീതി | 1200px |
AI നിങ്ങളുടെ വെബ്സൈറ്റ് Subframe ശൈലിയിൽ നിർമ്മിച്ച് അത് പൂരിപ്പിക്കും.
- Instagram, TikTok, Facebook ലിങ്കുകൾ വഴി ഉൽപ്പന്നങ്ങളും പോസ്റ്റുകളും പൂരിപ്പിക്കുക.
- നിങ്ങളുടെ പഴയ സൈറ്റിൽ നിന്ന് ഉള്ളടക്കം കൈമാറുക—വിലാസം മാത്രം വ്യക്തമാക്കുക.
- മികച്ച എഞ്ചിനിൽ ആധുനിക ഡിസൈൻ: സെർവർ റെൻഡറിംഗും SEO ഒപ്റ്റിമൈസേഷനും ഉള്ള React ( Next.js).
- തിരയൽ ഫലങ്ങൾക്കും ന്യൂറൽ നെറ്റ്വർക്ക് ശുപാർശകൾക്കുമായി പൂർണ്ണമായും ഓട്ടോമേറ്റഡ് SEO ഒപ്റ്റിമൈസേഷൻ.
സമാനമായ ശൈലികൾ
- monopo saigon — എഡിറ്റോറിയൽ നിശബ്ദതയ്ക്ക് പിന്നിൽ ഒരു ദ്രാവകവും തിളക്കമുള്ളതുമായ തിളക്കം - ഉരുകിയ വെളിച്ചത്തിൽ പൊങ്ങിക്കിടക്കുന്ന ഒരു മോണോക്രോം എഡിറ്റോറിയൽ ഗാലറി.
- Hyer Aviation — കോക്ക്പിറ്റിൽ പാർക്കിംഗ് ഏരിയയിൽ സന്ധ്യ. ഫ്യൂസ്ലേജ് വലിപ്പമുള്ള സെരിഫ് ലോഗോയിൽ വിളറിയ പ്രഭാത ആകാശം കാണാം, ഒപ്പം ഒരു ചൂടുള്ള കളിമൺ ആക്സന്റ് മോണോക്രോം നിയന്ത്രണത്തെ തകർക്കുന്നു.
- OFF+BRAND. — ചൂടുള്ള കടലാസിൽ തിളങ്ങുന്ന ഗോളം
- Seed — ലബോറട്ടറി ഗ്ലാസിന് കീഴിലുള്ള ഒരു ജീവജാലം
- Eindhoven Design District — വെള്ളക്കടലാസിലെ എഡിറ്റോറിയൽ ബ്രൂട്ടലിസം എന്നത് ഒരു മുനിസിപ്പൽ ഡിസൈൻ മാനിഫെസ്റ്റോയാണ്, വലിയ അക്ഷരത്തിൽ, കുറഞ്ഞ ഫോട്ടോഗ്രാഫിയും പൂർണ്ണ നിയന്ത്രണവും ഉപയോഗിച്ച് നടപ്പിലാക്കിയിരിക്കുന്നു.
- Miranda — ഇളം ക്രീം പശ്ചാത്തലത്തിൽ ക്ലാസിക് വൈഡ്-ഫോർമാറ്റ് തരം - ഡിജിറ്റൽ യുഗത്തിനായുള്ള ഒരു പത്ര എഡിറ്റോറിയൽ.
- Monocle — ക്രീം നിറമുള്ള പേപ്പറിൽ ഉയർന്ന നിലവാരമുള്ളതും വിശാലമായ ഫോർമാറ്റിലുള്ളതുമായ ഒരു പത്രം. ഓരോ കോളത്തിനും അതിന്റേതായ സ്ഥാനം അർഹിക്കുന്നതും പേജിൽ ഒരു അർത്ഥവത്തായ നിറം മാത്രം ദൃശ്യമാകുന്നതുമായ ശ്രദ്ധാപൂർവ്വം ക്യൂറേറ്റ് ചെയ്ത ഒരു എഡിറ്റോറിയൽ.
- Agencja brandingowa — കറുത്ത മഷിയിൽ ടൈപ്പോഗ്രാഫി ചെയ്ത വെളുത്ത ടോണുകളിൽ ഒരു എഡിറ്റോറിയൽ ഗാലറി.
- Websmith Studio — ക്രീം പേപ്പറിൽ പ്രഭാത വെളിച്ചം
- Aspelin Reitan — മെഴുകുതിരി വെളിച്ചത്തിൽ നിർമ്മിച്ച ആർക്കിടെക്ചറൽ ആർക്കൈവ് - പേജ് ഒരു ചൂടുള്ള ക്രീം ഭിത്തിയിൽ പിൻ ചെയ്തിരിക്കുന്ന, നിർമ്മിച്ച ഇടങ്ങളുടെ ഒരു പോർട്ട്ഫോളിയോ പോലെ കാണപ്പെടുന്നു, പേജിന്റെ മുഴുവൻ വീതിയിലും ഓരോ ചിത്രത്തിനും മുകളിൽ വെളുത്ത വാചകത്തിന്റെ ഒരു വരി പൊങ്ങിക്കിടക്കുന്നു.
- Public — കോൾഡ് മാർബിളിൽ ഒരു മോണോക്രോം എഡിറ്റോറിയൽ - ഏതാണ്ട് ഒരു മോണോക്രോം ക്യാൻവാസ്, 300-പോയിന്റ് സെരിഫ് ഫോണ്ടും ഒരു പർപ്പിൾ ആക്സന്റും ഉപയോഗിച്ച് എല്ലാ വർണ്ണ ജോലികളും ചെയ്യുന്നു.
- Motto — കടലാസിലെ ഒരു ടൈപ്പോഗ്രാഫിക് മോണോലിത്ത് - വെളുത്ത കടലാസിൽ സ്വയം പ്രഖ്യാപിക്കുന്ന ഒറ്റ, ആത്മവിശ്വാസമുള്ള ശബ്ദം.