
Seline Analytics
சூடான காகிதத்தில் ஒரு அமைதியான பகுப்பாய்வு அட்டவணை
செலின், ஒரு இதமான கல் பின்னணியில் (#fafaf9) ஒரே ஒரு துடிப்பான நீல நிற சிறப்பம்சத்துடன் அமைக்கப்பட்டுள்ளது—மற்ற அனைத்து வண்ணங்களும் நடுநிலையானவை மற்றும் டெய்ல்விண்ட் கல் வண்ணத் தட்டிலிருந்து எடுக்கப்பட்டவை. தலைப்புச் செய்திகள், 400 எடை மற்றும் குறுகிய எதிர்மறை எழுத்து இடைவெளியுடன், பிரத்யேகமாக வடிவமைக்கப்பட்ட வடிவியல் சான்ஸ்-செரிஃப் எழுத்துருவில் (ரூபர்ட்) வழங்கப்பட்டுள்ளன. இது, வழக்கமான உரத்த SaaS பாணிக்கு மாறாக, உரைக்கு ஒரு நிதானமான, கிட்டத்தட்ட கிசுகிசுப்பது போன்ற நம்பிக்கையை அளிக்கிறது. UI பரப்புகள், இதமான பின்னணிக்கு மேலே ஒரே ஒரு மென்மையான, 16px மங்கலுடன் மிதக்கும் தட்டையான வெள்ளை அட்டைகளாக உள்ளன; கனமான பிரிப்பான்கள் அல்லது பேனல்களுக்குப் பதிலாக, முதன்மை கட்டமைப்பு உறுப்பாக தாராளமாகப் பயன்படுத்தப்படும் மெல்லிய, 1px கல் நிறக் கோடுகளால் எல்லைகள் உருவாக்கப்பட்டுள்ளன. தளவமைப்பு உயிர்ப்புடன் உள்ளது: தாராளமான செங்குத்துத் தாளத்தில் மையப்படுத்தப்பட்ட முழு அகல உள்ளடக்கம், மாத்திரை வடிவ ஊடாடும் கட்டுப்பாடுகள், ஆளுமைக்கான ஒரு சின்னத்தின் சித்திரம், மற்றும் தயாரிப்புச் சான்றாக டாஷ்போர்டு ஸ்கிரீன்ஷாட்கள் ஆகியவை இடம்பெற்றுள்ளன. ஒட்டுமொத்தத் தோற்றம் தலையங்க ரீதியாக பகுப்பாய்வு செய்கிறது: அமைதியான, ஒற்றை வண்ண, நம்பிக்கையான, மற்ற அனைத்தும் வேண்டுமென்றே கட்டுப்படுத்தப்பட்டிருப்பதால், நீல நிறச் செயல் அழைப்புப் பக்கம் மிகவும் கவனத்தை ஈர்க்கும் கூறாக விளங்குகிறது.
இந்தப் பக்கம் அதிகபட்ச அகலத்துடன், சுமார் 1200px அளவில் மையப்படுத்தப்பட்டு, போதுமான செங்குத்து இடைவெளியுடன் உள்ளது. முகப்புப் பகுதி (hero) என்பது இரண்டு வரிகளைக் கொண்ட, இடதுபுறம் சீரமைக்கப்பட்ட ஒரு உரைத் தொகுதியாகும். அதில் நீல நிறத்தில், தனித்துக் காட்டப்பட்ட "எளிமையான மற்றும் பயனுள்ள" என்ற ஒரு சொற்றொடர் உள்ளது. அதைத் தொடர்ந்து, இரண்டு செயல் அழைப்புகள் (நீல மாத்திரை + பேய் மாத்திரை) கொண்ட ஒரு வரிசை, பின்னர் சாம்பல் நிறத்தில் கூட்டாளர் சின்னங்களின் ஒரு வரிசை, பின்னர் நம்பகத்தன்மை மதிப்பீடுகளின் ஒரு வரிசை, மற்றும் அடுத்த பகுதியைச் சற்றே மேலெழும்பும் முழு அகல மிதக்கும் டாஷ்போர்டு முன்னோட்டம் ஆகியவை உள்ளன. பக்கத்தின் கீழ்ப்பகுதியில் (below the fold), ஒற்றை-நெடுவரிசை கட்டத்தில் மாறி மாறி வரும் சான்றுகளின் வரிசைகள் உள்ளன. அதைத் தொடர்ந்து, அம்ச விளக்கங்கள், இடதுபுறம் சீரமைக்கப்பட்ட உரை மற்றும் மையப்படுத்தப்பட்ட தயாரிப்புக் காட்சிகள் கொண்ட முழு அகலப் பிரிவுகள் உள்ளன. வழிசெலுத்தல் (navigation) என்பது ஒரு எளிமையான மேல் பட்டையாகும்—இடதுபுறத்தில் சின்னம், மையப்படுத்தப்பட்ட வழிசெலுத்தல் இணைப்புகள், வலதுபுறத்தில் உள்நுழைவு + நீல நிற செயல் அழைப்பு—வழிசெலுத்தலின் நடுவில் அடையாளச் சரிபார்ப்பாகச் செயல்படும் அவதார்களின் மிதக்கும் தொகுப்பு உள்ளது. பிரிவுகளுக்கு இடையேயான இடைவெளிகள், தகவல்களின் அடர்த்தியான குழப்பத்தை உருவாக்குவதற்குப் பதிலாக ஒரு தலையங்கத் தாளத்தை உருவாக்கும் வகையில் அகலமாக (96px) அமைக்கப்பட்டுள்ளன.
தயாரிப்பின் பயனர் இடைமுகத்தின் ஸ்கிரீன்ஷாட்களே காட்சி மொழியில் ஆதிக்கம் செலுத்துகின்றன—டாஷ்போர்டு முன்னோட்டம் என்பது கிரேஸ்கேல் (1) (0.94) கான்ட்ராஸ்ட் ஃபில்டருடன் ரெண்டர் செய்யப்பட்ட ஒரு புகைப்படம் ஆகும், இது தரவின் வண்ணங்களை ஒரு மோனோக்ரோம் சாயலுக்கு மங்கச் செய்கிறது. ஒரே ஒரு மனித உருவம், SVG பாணியில் வெளிப்புறக் கோடுகளுடன் மட்டுமே வரையப்பட்ட ஒரு நேரியல் சின்ன ஸ்டிக்கர் (ஹூட் அணிந்த ஒரு கதாபாத்திரம்) ஆகும். இது பகுப்பாய்வு உள்ளடக்கத்திற்கு ஒரு விளையாட்டுத்தனமான எதிர்முனையாக, ஒவ்வொரு பிரிவிலும் ஒருமுறை வைக்கப்பட்டுள்ளது. மேலும், ஸ்டிக்கர் போன்ற ஆழமான தோற்றத்தை உருவாக்க ஒரு மென்மையான நிழலும் பயன்படுத்தப்பட்டுள்ளது. பிராண்ட் லோகோ மற்றும் குறியீடுகள் சிறிய கருப்பு தீப்பொறிகள்/சுடர்களாக உள்ளன. புகைப்படங்கள் எதுவும் இல்லை—வாழ்க்கை முறைப் படங்கள் இல்லை, குழுப் புகைப்படங்கள் இல்லை, சுற்றுச்சூழல் படங்கள் இல்லை. பொருளே (டாஷ்போர்டு) கதாநாயகன். அனைத்து அலங்கார ஐகான்களும் #0c0a09 அல்லது #3ba6f1 வண்ணங்களில் 1px அவுட்லைன் பாணியில் உள்ளன, அவை ஒருபோதும் நிரப்பப்படவில்லை.
வண்ணத் தட்டு
பிராண்ட்
- Cyan Signal
#3ba6f1— செயல்பாட்டின் மீது கவனத்தை ஈர்ப்பதற்காக, முக்கிய அழைப்புச் செயல்பாடு, செயல்படும் இணைப்புகள் மற்றும் பிராண்ட் சின்னங்களின் வெளிப்புற வடிவம் ஆகியவை மட்டுமே பக்கத்தில் உள்ள வண்ண அலங்காரங்களாகக் குறைவாகப் பயன்படுத்தப்பட்டுள்ளன. - Cyan Edge
#3398e1— செயல் திட்டங்கள், இணைப்பு லேபிள்கள் மற்றும் ஊடாடும் கூறுகளை முன்னிலைப்படுத்த நீல நிறம் பயன்படுத்தப்படுகிறது. செயலழைப்புகளுக்கு இதை முதன்மை நிறமாகப் பயன்படுத்தக் கூடாது.
நடுநிலை
- Ink Black
#0c0a09— முதன்மைத் தலைப்புகள், சிறப்பித்துக் காட்டப்பட்ட முக்கிய உரை மற்றும் உணர்வுகளை வெளிப்படுத்தும் சின்னங்கள் ஆகியவை இதமான, கிட்டத்தட்ட கருப்பு நிறத்தில் உள்ளன. - Stone Canvas
#fafaf9— பக்கத்தின் பின்னணி, திரையின் வெள்ளை நிறத்தைப் போலல்லாமல், காகிதம் போன்ற உணர்வைத் தரும் ஒரு இதமான, கிரீம் போன்ற நிறத்தில் உள்ளது. - Pure White
#ffffff— வரைபட மேற்பரப்புகள், துருத்திக் கொண்டிருக்கும் பலகைகள் மற்றும் உள்ளீட்டுப் புல நிரப்பிகள் ஆகியவை இயல்பாகவே தட்டையாகவும் நிழலற்றதாகவும் இருக்கும். - Stone Border
#e8e6e5— அட்டைகள், வழிசெலுத்தல் மற்றும் உள்ளீட்டுப் புலங்களில் உள்ள மெல்லிய ஓரங்களே முதன்மைக் கட்டமைப்பு உறுப்பாகும், பிரிப்பான்கள் அல்ல. - Stone Muted
#d6d3d1— கூடுதல் சட்டங்கள், மென்மையான பின்னணி வண்ணங்கள், அலங்காரப் பிரிப்பான்கள். - Ash Gray
#a8a29e— உதவி உரை, சின்னங்களின் வெளிக்கோடுகள், செயலிழந்த நிலைகள் - படிக்கக்கூடியவை ஆனால் செயலற்றவை.
அச்சுக்கலை
10 முதல் 52px வரை · 5 படிகள்
- Roobert — மாற்று: Inter Tight or Satoshi · வெளிப்புறங்கள் 400, 500 · தலைப்புகள் மற்றும் உரை அமைப்பிற்கான எழுத்துரு, மிகக்குறைந்த எதிர்மறை எழுத்து இடைவெளியுடன் (32px-ல் -0.025em, 52px-ல் -0.021em) கூடிய ஒரு தனித்துவமான வடிவியல் சான்ஸ்-செரிஃப் ஆகும். 400 x 52px தடிமன் என்பதே இந்த எழுத்துருவின் தனிச்சிறப்பு: வழக்கத்திற்கு மாறான, நுட்பமான, அதே சமயம் அதிகாரமிக்க, அடக்கமான தோற்றம். தலைப்புகள், ஆதிக்கம் செலுத்தாமல் தகுந்த இடத்தில் அமைகின்றன.
- Inter — மாற்று: Inter · வெளிப்புறங்கள் 400, 500, 600 · முக்கிய உரை, வழிசெலுத்தல், பயனர் இடைமுகம் மற்றும் தலைப்புகளுக்கான முதன்மை எழுத்துரு, திரைக்கு வெளியே உள்ள அனைத்து உரைகளுக்கும் பொதுவான ஒரு நடுநிலையான எழுத்துருவாகும். 14px அளவு, 400 தடிமன் மற்றும் 1.64 வரி இடைவெளி ஆகியவை முக்கிய உரையின் பிரதான அளவாகும் (அதிர்வெண் 1174). சிறிய அளவுகளில் நேர்மறை எழுத்து இடைவெளி (0.004em), அடர்த்தியான பயனர் இடைமுகத்தின் வாசிப்புத்தன்மையை உறுதி செய்கிறது.
இடைவெளிகள் மற்றும் வடிவம்
| நோக்கம் | பொருள் |
|---|---|
| அடர்த்தி | விசாலமான |
| அடிப்படை படி | 8px |
| பொத்தான் ஆரம் | 9999px |
| அட்டை ஆரம் | 10px |
| நிழல்கள் | மென்மையான நிழல்கள் |
| பிரிவுகளுக்கு இடையில் | 96px |
| பக்க அகலம் | 1200px |
செயற்கை நுண்ணறிவு உங்கள் வலைத்தளத்தை Seline Analytics பாணியில் உருவாக்கி, அதை நிரப்பும்.
- Instagram, TikTok, Facebook இணைப்புகளின் வழியாக தயாரிப்புகளையும் பதிவுகளையும் நிரப்பவும்.
- உங்கள் பழைய தளத்திலிருந்து உள்ளடக்கத்தை மாற்றவும்—முகவரியைக் குறிப்பிட்டால் போதும்.
- சிறந்த இன்ஜினான React ( Next.js)-இல், சர்வர் ரெண்டரிங் மற்றும் உள்ளமைக்கப்பட்ட SEO மேம்படுத்தலுடன் கூடிய நவீன வடிவமைப்பு.
- தேடல் முடிவுகளுக்கான முழுமையாகத் தானியங்குபடுத்தப்பட்ட SEO உகப்பாக்கம் மற்றும் நியூரல் நெட்வொர்க் பரிந்துரைகள்.
ஒத்த பாணிகள்
- ElevenLabs — மென்மையான தலைப்புகளுடன், இதமான கிரீம் வண்ணங்களில் அமைந்த ஒரு புகைப்படக் கட்டுரை. ஒரு பௌஹாஸ் பாணி நோட்டுப்புத்தகம்—முட்டை ஓட்டு நிறக் காகிதம், கருப்பு மை, மற்றும் பொருளைக் காட்சிப்படுத்த ஒற்றை ஊதா மற்றும் ஆரஞ்சு வண்ண அலங்காரம்.
- Awesomic — காகிதத் துண்டுகளை நினைவூட்டும் ஆரஞ்சு நிற நிறுத்தற்குறிகளுடன் கூடிய தலையங்க துத்தநாக வலை.
- Monad — வெதுவெதுப்பான தோல் காகிதம் குறித்த தலையங்க தொழில்நுட்ப இதழ்
- Dub — லிங்கின் மேட் அரிசி காகித கட்டுப்பாட்டுப் பலகம்
- Notion — நண்பகல் வெயிலில் ஒரு சூடான காகித நோட்டுப்புத்தகம்
- Anthropic — வெதுவெதுப்பான தோல் தாளில் அச்சிடப்பட்ட ஒரு அறிவியல் கள ஆய்விதழ்—அமைதியான தந்த நிற மேற்பரப்புகள், செரிஃப் வடிவ தலையங்கத் தலைப்புகள், மற்றும் செயல்பாடு தேவைப்படும்போது மட்டும் தோன்றும் ஒரு களிமண் நிறச் சின்னம்.
- Calendly — குளிர்ந்த பளிங்குக் கல்லின் மீது அடர் நீல மை
- Augen Pro — ஆப்பிளின் வெள்ளை நிறக் காட்சியமைப்பில், ஒரே வண்ணமுடைய இடத்தில், நேர்த்தியான, எடையற்ற, மின்னல் நீல நிறம் மட்டுமே தனிச்சிறப்பாக இடம்பெற்றுள்ளது.
- Antimetal — வெளிர் நிறத் தாளில் ஒரு தலையங்கக் குறிப்பு—ஒரு அறிவியல் இதழில் ஓர் அமைதியான காலைப் பொழுது; அங்கே நிதானம் தன்னம்பிக்கையை வெளிப்படுத்த, செரிஃப் எழுத்துருக்கள் கடினமான வேலையைச் செய்கின்றன.
- Perk — சூடான காகிதத்தோல் மீது மின்சார சுண்ணாம்பு
- Ditto — சூரிய ஒளி நிறைந்த ஒரு பட்டறையில் காட்டுப்பூ மாதிரிகள் உருவாக்கப்படுகின்றன. வெதுவெதுப்பான கிரீம் நிறப் பரப்புகள், துடிப்பான மஞ்சள் நிற அடிப்பூ, அடர் கடற்படை நீல மைகள், படைப்பிற்குப் பின்னால் மலரும் இயற்கையான வண்ண வடிவங்கள்.
- Officevibe — வெதுவெதுப்பான கிரீம் நிறக் காகிதத்தில் ஒரு தலையங்க இதழ். மனிதவள மேலாண்மை குறித்த ஒரு சிந்தனைமிக்க கட்டுரையை, ஒரு தயாரிப்பாக முன்வைக்கப்படுவதைக் கற்பனை செய்து பாருங்கள்—ஒரு நவீன நீல இடைமுகத்தின் வழியே மெல்லிய செரிஃப் எழுத்துரு மென்மையாக ஒலிப்பது போல.