Apple (España)
വെളുത്ത ഇടത്തിന്റെ ഒരു കത്തീഡ്രൽ, കേൾക്കാൻ പോലും പറ്റാത്ത തലക്കെട്ടുകൾ. 700 സാന്ദ്രതയുള്ള വലിയ ഫോണ്ടുകൾ വായുവിൽ തൂങ്ങിക്കിടക്കുന്ന, പാസ്റ്റൽ നിറങ്ങളും ഒരൊറ്റ നീല നൂലും മാത്രം ചേർത്തിരിക്കുന്ന, വിശാലമായ, ശോഭയുള്ള ഒരു ഹാൾ.
ആപ്പിളിന്റെ ഉൽപ്പന്ന പേജ് ഭാഷ ടൈപ്പോഗ്രാഫിക് ഉദാരതയെക്കുറിച്ചുള്ള ഒരു പഠനമാണ്: വെളുത്ത നിറത്തിലുള്ള പശ്ചാത്തലത്തിൽ, വിശാലമായ വെളുത്ത ഇടത്താൽ ചുറ്റപ്പെട്ട വലിയ SF Pro ഡിസ്പ്ലേ തലക്കെട്ടുകൾ, ഓരോ വാക്കും മനഃപൂർവ്വം തോന്നിപ്പിക്കുന്ന തരത്തിൽ. പാലറ്റ് മോണോക്രോമാറ്റിക് ആണ് - #1d1d1f ലെ വാചകം, #ffffff നും #f5f5f7 നും ഇടയിൽ മാറിമാറി വരുന്ന ക്യാൻവാസ് - സംവേദനാത്മക നിമിഷങ്ങൾക്കായി മാത്രമായി നീക്കിവച്ചിരിക്കുന്ന ഒരൊറ്റ നീല ആക്സന്റോടെ (#0071e3). ഉൽപ്പന്ന ചിത്രങ്ങളിൽ തന്നെ നിറം ഉണ്ട് (പാസ്റ്റൽ ടോണുകൾ), ഒരിക്കലും അലങ്കാര UI ഘടകങ്ങളായിട്ടല്ല. ഘടകങ്ങൾ ഫ്രെയിംലെസ് ആണ്: 28px ആരമുള്ള വൃത്താകൃതിയിലുള്ള കാർഡുകൾ, പേജിന്റെ അരികുകളിൽ ഏതാണ്ട് സ്പർശിക്കുന്ന ഗുളിക ആകൃതിയിലുള്ള ബട്ടണുകൾ, ദൃശ്യമായ കണ്ടെയ്നറുകളോ ഡ്രോപ്പ് ഷാഡോകളോ ഇല്ലാതെ. ഡിവൈഡറുകളോ ബോർഡറുകളോ അല്ല, വെള്ളയും ചാരനിറത്തിലുള്ള വരകളും മാറിമാറി ഉപയോഗിച്ചാണ് റിഥം സൃഷ്ടിക്കുന്നത്.
പേജിന്റെ മുഴുവൻ വീതിയും വിഭാഗങ്ങൾ ഉൾക്കൊള്ളുന്നു, ഉദാരമായ പാഡിംഗ് (ഏകദേശം 40-100 വശങ്ങൾ) ഉപയോഗിച്ച് അരികിൽ നിന്ന് അരികിലേക്ക് നീളുന്നു. പരമാവധി ഉള്ളടക്ക വീതി ഓരോ സ്ട്രിപ്പിലും ഫലപ്രദമായി കേന്ദ്രീകരിച്ചിരിക്കുന്നു. പ്രധാന ഘടകം ഒരു കേന്ദ്രീകൃത സ്റ്റാക്ക് ആണ്: ഒരു പുരികത്തിന്റെ ആകൃതിയിലുള്ള ലേബൽ, വലുതാക്കിയ തലക്കെട്ട്, ഒരൊറ്റ കോൾ-ടു-ആക്ഷൻ ബട്ടൺ, ഒരു വില വരി, തുടർന്ന് വ്യൂപോർട്ടിന്റെ അടിയിൽ നിറയുന്ന ഒരു ഉൽപ്പന്ന ചിത്രം. വിഭാഗങ്ങൾ ആവർത്തിക്കുന്ന ഒരു പാറ്റേൺ പിന്തുടരുന്നു: സ്ട്രിപ്പിനുള്ളിൽ ഇടതുവശത്ത് വിന്യസിച്ച തലക്കെട്ട്, തുടർന്ന് ഉൽപ്പന്ന വിവരണങ്ങളുള്ള രണ്ട്-കോളം ലേഔട്ട് (ഇടതുവശത്തുള്ള വാചകം/വലതുവശത്തുള്ള ചിത്രം അല്ലെങ്കിൽ ഒന്നിടവിട്ട്), കാർഡുകളുടെ മൂന്ന്-കോളം ഗ്രിഡ്, അല്ലെങ്കിൽ ഒരു കേന്ദ്രീകൃത വിഷ്വൽ ഷോകേസ്. 100-100 സെന്റീമീറ്റർ ലംബ വിടവുകളുള്ള വെള്ള, മൂന്ന്-വർണ്ണ പശ്ചാത്തലങ്ങൾ ഒന്നിടവിട്ട് ഉപയോഗിച്ചാണ് ഉള്ളടക്ക താളം പൂർണ്ണമായും നിയന്ത്രിക്കുന്നത് - ഡിവൈഡറുകളില്ല, ഘടകങ്ങൾ വഹിക്കുന്ന കാർഡുകളില്ല. ഗ്ലോബൽ നാവിഗേഷൻ ഒരു ഒറ്റ, നിശ്ചിത ബാറാണ്. ഉൽപ്പന്ന സ്പെസിഫിക്കേഷൻ വിഭാഗങ്ങൾ ഉദാരമായ പാഡിംഗുള്ള പൂർണ്ണ-വിഡ്ത്ത് ബാൻഡുകൾ ഉപയോഗിക്കുന്നു, ഇവിടെ വാചകം വിശാലമായ ദൃശ്യ മേഖലയ്ക്കെതിരെ ഇടുങ്ങിയ കോളങ്ങളിൽ (~560px) കേന്ദ്രീകരിച്ചിരിക്കുന്നു.
ആപ്പിളിന്റെ ദൃശ്യഭാഷ പ്രധാനമായും ഉൽപ്പന്ന ഫോട്ടോഗ്രാഫിയാണ്: ജീവിതശൈലി സന്ദർഭമോ അരങ്ങേറിയ ദൃശ്യങ്ങളോ ഇല്ലാതെ, ശുദ്ധമായ വെള്ള അല്ലെങ്കിൽ വർണ്ണ പശ്ചാത്തലത്തിൽ ഹാർഡ്വെയറിന്റെ ക്ലോസ്-അപ്പുകൾ. പ്രധാന ചിത്രത്തിൽ പാസ്റ്റൽ പച്ച നിറത്തിലുള്ള മാക്ബുക്ക് നിയോ കൈകൾ പിടിച്ചിരിക്കുന്നതായി കാണിക്കുന്നു - മനുഷ്യ ഘടകം ദ്വിതീയമാണ്, വികാരത്തേക്കാൾ സ്കെയിലും ഘടനയും പ്രകടമാക്കുന്നു. ഉൽപ്പന്ന വേരിയന്റ് വിഭാഗങ്ങളിൽ, പൊരുത്തപ്പെടുന്ന ട്രിം നിറങ്ങളുടെ പശ്ചാത്തലത്തിൽ (പിങ്ക്, പച്ച, വെള്ളി, ആകാശ നീല) രണ്ട് ഉപകരണങ്ങൾ അടുത്തടുത്തായി പ്രദർശിപ്പിച്ചിരിക്കുന്നു, ഓരോ കാർഡും മധ്യഭാഗത്ത് ഉൽപ്പന്നത്തോടുകൂടിയ ഒരു പരന്ന വർണ്ണ ഫീൽഡ് ഉപയോഗിക്കുന്നു. വിശദമായ ഷോട്ടുകൾ ഒരു നിഷ്പക്ഷ പശ്ചാത്തലത്തിൽ അങ്ങേയറ്റത്തെ ക്ലോസ്-അപ്പുകൾ (ലാപ്ടോപ്പ് ഹിഞ്ച്, ക്യാമറ മൊഡ്യൂൾ) ഉപയോഗിക്കുന്നു. ചിത്രീകരണങ്ങളില്ല, അമൂർത്ത ഗ്രാഫിക്സില്ല, അലങ്കാര ചിത്രങ്ങളില്ല - ഉൽപ്പന്നം തന്നെയാണ് ദൃശ്യ ഘടകം. ഐക്കണോഗ്രഫി എല്ലായിടത്തും ഉണ്ട് - SF ചിഹ്ന ശൈലിയിലുള്ള മോണോക്രോം ലൈൻ ഐക്കണുകൾ, 1.5–2px കട്ടിയുള്ളത്, ആപ്പിൾ സിസ്റ്റം ഐക്കൺ സെറ്റിൽ നിന്ന് എടുത്തതാണ്. ഫോട്ടോഗ്രാഫി എല്ലായ്പ്പോഴും ഉയർന്ന കീ രീതിയിലാണ് ചെയ്യുന്നത്: ഏകീകൃതവും നിഴൽ രഹിതവുമായ ലൈറ്റിംഗ്, അത് ഉൽപ്പന്നത്തെ ഒരു ത്രിമാന വസ്തുവിനേക്കാൾ ഗ്രാഫിക് രൂപത്തിലേക്ക് കുറയ്ക്കുന്നു.
പാലറ്റ്
ബ്രാൻഡ്
- Electric Blue
#0071e3— UI-യിലെ ഒരേയൊരു കളർ ആക്സന്റ് ഫിൽഡ് ആക്ഷൻ ബട്ടണുകളാണ്, പ്രവർത്തനത്തിനുള്ള കോളുകൾക്ക് വളരെ കുറച്ച് മാത്രമേ ഇവ ഉപയോഗിക്കുന്നുള്ളൂ. - Link Blue
#0066cc— ഇൻലൈൻ ടെക്സ്റ്റ് ലിങ്കുകൾ, അമ്പടയാളങ്ങളും ഷെവ്റോണുകളും ഉള്ള ലിങ്കുകൾ. - Citrus Gradient
#3b3b23— മഞ്ഞ-പച്ച ഹൈലൈറ്റുകളായി മങ്ങുന്ന ഒരു ഇരുണ്ട അടിത്തറയാണ് ഉൽപ്പന്നത്തിന്റെ സിഗ്നേച്ചർ സവിശേഷതയായി മാറിയ മറ്റൊരു ഫിനിഷ്.
നിഷ്പക്ഷം
- Primary Ink
#1d1d1f— എല്ലാ പ്രതലങ്ങളിലും പ്രധാന ഫോർഗ്രൗണ്ട് ടോൺ ഹെഡ്ലൈനുകൾ, ബോഡി ടെക്സ്റ്റ്, ബട്ടൺ ലേബലുകൾ എന്നിവയാണ്; പ്രധാന ഉൽപ്പന്ന ചിത്രത്തിന്റെ പശ്ചാത്തലം മുകളിലുള്ള സോളിഡ് #1d1d1f-ൽ നിന്ന് ക്രോമാറ്റിക് നീലയിലേക്ക് സുഗമമായി മാറുന്നു. - Mid Gray
#707070— ദ്വിതീയ വാചകം, നിഷ്ക്രിയ നാവിഗേഷൻ നില, മ്യൂട്ട് ചെയ്ത UI ലേബലുകൾ - Deep Gray
#474747— നാവിഗേഷൻ ടെക്സ്റ്റും ഐക്കണോഗ്രഫിയും ഇടത്തരം ഫോണ്ടിലാണ്. - Hairline
#d6d6d6— വിഭാഗങ്ങൾക്കും UI ഘടകങ്ങൾക്കും ഇടയിലുള്ള നേർത്ത അതിരുകൾ. - Canvas
#f5f5f7— ഒന്നിടവിട്ട വിഭാഗ പശ്ചാത്തലങ്ങൾ - വെളുത്ത ഭാഗങ്ങളെ വേർതിരിക്കുന്ന ഒരു ചാരനിറത്തിലുള്ള വര. - Paper
#ffffff— കാർഡ് ഉപരിതലം, പ്രധാന പേജ് പശ്ചാത്തലം, ഇരുണ്ട പശ്ചാത്തലത്തിൽ ബട്ടൺ വാചകം.
ടൈപ്പോഗ്രാഫി
12 മുതൽ 96px വരെ · 10 ചുവടുകൾ
- SF Pro Display — മാറ്റിസ്ഥാപിക്കൽ: Inter · രൂപരേഖകൾ 600, 700 · പ്രദർശനത്തിനുള്ള ഹീറോ തലക്കെട്ടുകളും ഉപതലക്കെട്ടുകളും — 80–96px-ൽ 700 ഭാരം, നെഗറ്റീവ് അക്ഷരങ്ങൾ -1.44px അകലത്തിൽ, ആപ്പിളിന്റെ സിഗ്നേച്ചർ "വെള്ളയിൽ പൊങ്ങിക്കിടക്കുന്ന വലിയ തലക്കെട്ട്" സൃഷ്ടിക്കുന്നു. പകരക്കാർ: ഇന്റർ, സിസ്റ്റം-യുഐ.
- SF Pro Display — മാറ്റിസ്ഥാപിക്കൽ: Inter · രൂപരേഖകൾ 600 · വിഭാഗ തലക്കെട്ടുകൾ, കാർഡ് തലക്കെട്ടുകൾ, ഉപതലക്കെട്ടുകൾ - മുകളിലുള്ള ചെറിയ തലക്കെട്ടുകളിൽ നിന്ന് വ്യത്യസ്തമായി, ഇടത്തരം വലിപ്പത്തിൽ ഉപയോഗിക്കുമ്പോൾ അൽപ്പം പോസിറ്റീവ് അക്ഷര വിടവുള്ള 600 ഫോണ്ട് ഊഷ്മളവും സൗഹൃദപരവുമാണ്.
- SF Pro Text — മാറ്റിസ്ഥാപിക്കൽ: Inter · രൂപരേഖകൾ 400, 500, 600 · ബോഡി ടെക്സ്റ്റ്, നാവിഗേഷൻ, പിന്തുണയ്ക്കുന്ന ഖണ്ഡികകൾ, ചെറിയ അടിക്കുറിപ്പുകൾ എന്നിവയ്ക്ക്, 17px ൽ 400 സൂചികയുള്ള ഒരു ഫോണ്ട് ആണ് പ്രാഥമിക ഫോണ്ട്. നെഗറ്റീവ് ലെറ്റർ സ്പേസിംഗ് കൂടുതൽ വിവരങ്ങൾ നിറഞ്ഞ പേജുകളിൽ കൂടുതൽ സംക്ഷിപ്തമായ പ്രധാന ടെക്സ്റ്റ് അനുവദിക്കുന്നു.
ഇടവേളകളും രൂപവും
| ഉദ്ദേശ്യം | അർത്ഥം |
|---|---|
| സാന്ദ്രത | ഇടതൂർന്ന |
| അടിസ്ഥാന ഘട്ടം | 8-10px |
| ബട്ടൺ ആരം | 980px |
| കാർഡ് ആരം | 28px |
| ഷാഡോകൾ | ഷാഡോകൾക്ക് പകരം ബോർഡറുകൾ ഇല്ല |
| വിഭാഗങ്ങൾക്കിടയിൽ | 100-120px |
| പേജ് വീതി | 1200px |
AI നിങ്ങളുടെ വെബ്സൈറ്റ് Apple (España) ശൈലിയിൽ നിർമ്മിച്ച് അത് പൂരിപ്പിക്കും.
- Instagram, TikTok, Facebook ലിങ്കുകൾ വഴി ഉൽപ്പന്നങ്ങളും പോസ്റ്റുകളും പൂരിപ്പിക്കുക.
- നിങ്ങളുടെ പഴയ സൈറ്റിൽ നിന്ന് ഉള്ളടക്കം കൈമാറുക—വിലാസം മാത്രം വ്യക്തമാക്കുക.
- മികച്ച എഞ്ചിനിൽ ആധുനിക ഡിസൈൻ: സെർവർ റെൻഡറിംഗും SEO ഒപ്റ്റിമൈസേഷനും ഉള്ള React ( Next.js).
- തിരയൽ ഫലങ്ങൾക്കും ന്യൂറൽ നെറ്റ്വർക്ക് ശുപാർശകൾക്കുമായി പൂർണ്ണമായും ഓട്ടോമേറ്റഡ് SEO ഒപ്റ്റിമൈസേഷൻ.
സമാനമായ ശൈലികൾ
- Airbnb — ഒറ്റ പവിഴപ്പുറ്റിന്റെ ചുവന്ന ബുക്ക്മാർക്കുള്ള ശാന്തമായ വെളുത്ത ഗാലറി മതിൽ.
- Peak Design — ഭാഗികമായി പ്രകാശമുള്ള ഗാലറി മതിൽ
- Ramp — എഡിറ്റോറിയൽ ഫിനാൻസ് വിഭാഗം, കറുപ്പും വെളുപ്പും പേജുകൾ ഒറ്റ നിയോൺ മാർക്കർ ഉപയോഗിച്ച്. പ്രസിദ്ധീകരണത്തിന്റെ പ്രായോഗികമായി മോണോക്രോം പ്രതലം, അവിടെ ഒരു തിളക്കമുള്ള നാരങ്ങ-പച്ച സ്ട്രോക്ക് ഓരോ ഇടപെടലിനെയും ഒരു പണ സിഗ്നലാക്കി മാറ്റുന്നു.
- 099 SUPPLY — കറുപ്പും വെളുപ്പും നിറമുള്ള വസ്തുക്കൾ നിറഞ്ഞ ഒരു ഗാലറി മതിൽ
- Orderful — ഇൻഡസ്ട്രിയൽ ലോജിസ്റ്റിക്സ് കൺട്രോൾ ഡെക്ക് - കറുത്ത മഷിയിലും സർജിക്കൽ റെഡ് നിറത്തിലും നിർമ്മിച്ച ഒരു പ്രിന്റ് ചെയ്ത ലോജിസ്റ്റിക്സ് ഡിസ്പാച്ചർ ചെക്ക്ലിസ്റ്റ്, ഓരോ പേജും ഒരു ഓപ്പറേറ്റർക്ക് പ്രധാനപ്പെട്ട എന്തെങ്കിലും വിളിച്ചുപറയാൻ അനുവദിക്കുന്ന തരത്തിൽ വിവേകപൂർണ്ണമാണ്.
- Apple (España) — വെളുത്ത ഗാലറി ഡിസ്പ്ലേ കേസ്
- teenage engineering — സ്റ്റുഡിയോ ലൈറ്റിംഗിലെ വ്യാവസായിക കാറ്റലോഗ് - പേജിലെ ഒരേയൊരു പ്രധാന വസ്തു ഉൽപ്പന്നമാണ്, മറ്റെല്ലാം അതിനെ ചുറ്റിപ്പറ്റിയാണ് ചർച്ച ചെയ്യുന്നത്.
- Apple (España) — പ്രഭാത മൂടൽമഞ്ഞിൽ ഒരു ഗാലറി വിൻഡോ
- Lightship — തുറന്ന റോഡിന്റെ ഒരു സിനിമാറ്റിക് ഡയോരമ. അടുത്ത ഇടവേളകളിൽ സ്ഥാപിച്ചിരിക്കുന്ന വലിയ ലാൻഡ്സ്കേപ്പ് ഫോട്ടോഗ്രാഫുകൾ, ഫ്രെയിമുകളിൽ കഷ്ടിച്ച് കാണാവുന്ന നേർത്ത കറുത്ത ടൈപ്പ്, ഒരു പുൽമേടിലെ തീപ്പൊരി പോലെ മോണോക്രോമിനെ തകർക്കുന്ന ഒരു തിളക്കമുള്ള ഓറഞ്ച് ആക്സന്റ് എന്നിവയാൽ അലങ്കരിച്ച ചൂടുള്ള ക്രീം ഗാലറി ചുവരുകൾ.
- Custo — മോണോലിത്തിക് ഫോണ്ടുള്ള ഗൺമെറ്റൽ നിറമുള്ള ഗാലറി. മ്യൂട്ട് ചെയ്ത ചാര-പച്ച ടോണുകളിൽ ഒരു ഷോറൂം, അവിടെ ഒരു ഇരുണ്ട വസ്തുവും 57px ഫോണ്ടും സ്വയം സംസാരിക്കുന്നു.
- Silencio — പൊങ്ങിക്കിടക്കുന്ന കലാസൃഷ്ടികളുള്ള ഒരു വെളുത്ത മുറി. ചൂടുള്ള കടലാസ് കൊണ്ട് നിർമ്മിച്ച ഒരു ഗാലറി ഡിസ്പ്ലേ, നെഗറ്റീവ് വോളിയത്തിന്റെ പശ്ചാത്തലത്തിൽ ഓരോ ഘടകവും അതിന്റേതായ സ്ഥാനം പിടിക്കുന്നു, നിശബ്ദത മനഃപൂർവ്വം രൂപകൽപ്പന ചെയ്ത ഒരു തീരുമാനമാണ്.
- ORYZO AI — ഒരു ഇരുണ്ട മുറിയെക്കുറിച്ചുള്ള ഒരു ഫോട്ടോ ഉപന്യാസം. ചൂടുള്ള ഇരുട്ടിൽ ഒറ്റയ്ക്ക് ചുറ്റിത്തിരിയുന്ന ഒരു വസ്തു, ക്രീം ഫോണ്ട് മാത്രമാണ് അലങ്കാരം.