Allbirds
સફેદ શણ પર કુદરતી સામગ્રી
ઓલબર્ડ્સ શાંત, કુદરતી આત્મવિશ્વાસ સાથે કાર્ય કરે છે - લગભગ સંપૂર્ણપણે એક્રોમેટિક કેનવાસ, ગરમ રેતી (#e0dacf) અને મ્યૂટ અર્થ ટોન દ્વારા પૂરક, જે સીધા ઉત્પાદન ફોટોગ્રાફીમાંથી લેવામાં આવે છે. વપરાશકર્તા ઇન્ટરફેસ ઉત્પાદન અનુભવમાં દખલ કરતું નથી: સફેદ સપાટીઓ, પાતળી સરહદો, ઓલ-કેપ્સ નેવિગેશન અને ગોળી આકારના નિયંત્રણો જે વેબ તત્વો કરતાં ભૌતિક બટનો જેવા લાગે છે. સેલ્ફ મોર્ડન (એક કસ્ટમ સેરીફ ફોન્ટ) નો ઉપયોગ સંપાદકીય ધ્યાનની જરૂર હોય તેવી કેટલીક મહત્વપૂર્ણ ક્ષણો માટે થાય છે - હેડલાઇન્સ અને સંગ્રહ નામો - જ્યારે જિયોગ્રાફનો ઉપયોગ દરેક અક્ષર, બોડી કોપી અને બટન માટે ત્રણ સંતુલિત વજનમાં થાય છે. કેટેગરી કાર્ડ્સ એક રંગ પ્રણાલી બની જાય છે: દરેક ફીચર્ડ પ્રોડક્ટમાંથી તેનો પૃષ્ઠભૂમિ રંગ લે છે, નેવિગેશનને જીવંત પેન્ટોન પેલેટમાં રૂપાંતરિત કરે છે.
મહત્તમ પહોળાઈ ~1200px છે, જે ઉદાર સાઇડ પેડિંગ સાથે કેન્દ્રિત છે. મુખ્ય તત્વ ગરમ રેતીની પૃષ્ઠભૂમિ પર પૂર્ણ-પહોળાઈની સંપાદકીય પટ્ટી છે જેમાં કેન્દ્રમાંથી એક મોટું ઉત્પાદન કેરોયુઝલ નીકળે છે. શ્રેણી નેવિગેશન એ ચાર સ્તંભોમાં ચાર સમાન રંગીન કાર્ડ્સનું ગ્રીડ છે, જેમાં દરેકમાં એક જ કેન્દ્રિત જૂતા મોડેલ છે. ફોલ્ડની નીચે, લેઆઉટ પૂર્ણ-પહોળાઈના વિભાજીત પેનલ્સ (ડાબી બાજુએ જીવનશૈલીનો ફોટો + જમણી બાજુએ ઉત્પાદન નમૂના) અને નાના, રેખાંકિત વિભાગ શીર્ષક હેઠળ કેન્દ્રિત ઉત્પાદન કેરોયુઝલ વચ્ચે વૈકલ્પિક રીતે ગોઠવાય છે. એકંદર લય છે: પૂર્ણ-પહોળાઈના સંપાદકીય પેનલ → ચાર-કૉલમ ગ્રીડ → કેન્દ્રિત ઉત્પાદન કેરોયુઝલ → બે-કૉલમ વિભાજીત → કેન્દ્રિત ઉત્પાદન કેરોયુઝલ. વિભાગો વચ્ચેનું અંતર 40-56px છે, જે હવાદાર પરંતુ ભારે સંક્રમણો બનાવે છે. નેવિગેશન કેન્દ્રિત પ્રાથમિક લિંક્સ સાથે ઓછામાં ઓછા, નિશ્ચિત ટોચનો બાર છે.
ફોટોગ્રાફી એ સમગ્ર દ્રશ્ય પ્રણાલી છે. બધા ઉત્પાદન શોટ્સ ક્લોઝ-અપ છે, સહેજ ખૂણાથી, એક મજબૂત પૃષ્ઠભૂમિ સામે જે જૂતાના ઉચ્ચારણ રંગ સાથે મેળ ખાય છે અથવા પૂરક છે, જે અસરકારક રીતે દરેક ફોટાને રંગ અભ્યાસમાં ફેરવે છે. જીવનશૈલીના ફોટા ગરમ, સન્ની ટોનમાં, કુદરતી સેટિંગ્સમાં (એગેવ ફીલ્ડ્સ, લાકડાના ડેક, ખરબચડી ભૂપ્રદેશ) શૂટ કરવામાં આવ્યા છે, મ્યૂટ પેલેટ સાથે મેળ ખાવા માટે સૂક્ષ્મ રીતે મ્યૂટ કરવામાં આવ્યા છે. કોઈ ચિત્રો નથી, કોઈ 3D રેન્ડર નથી, કોઈ અમૂર્ત ગ્રાફિક્સ નથી. પેન્ટોન સાથે સહયોગમાં, શાબ્દિક રંગ પેલેટનો ઉપયોગ ગ્રાફિક તત્વ તરીકે થાય છે. આઇકોનોગ્રાફી ઓછામાં ઓછી અને મોનોક્રોમ છે (નેવિગેશન અને સહાયક સ્થિતિમાં રૂપરેખા ચિહ્નો).
પેલેટ
તટસ્થ
- Canvas White
#ffffff— પૃષ્ઠ પૃષ્ઠભૂમિ છબીઓ, કાર્ડ સપાટીઓ, ઉત્પાદન કાર્ડ પૃષ્ઠભૂમિ છબીઓ. - Charcoal
#212121— ગૌણ UI ઘટકો, વિભાજકો અને મ્યૂટ કરેલા લેબલ્સ માટે તટસ્થ રંગ સપોર્ટેડ છે. કૉલ્સ ટુ એક્શન માટે તેનો પ્રાથમિક રંગ તરીકે ઉપયોગ થવો જોઈએ નહીં. - True Black
#000000— હેડિંગ, આઇકોન્સ, હાઇ-કોન્ટ્રાસ્ટ ફ્રેમ્સ, નેવિગેશન ટેક્સ્ટ. - Warm Sand
#e0dacf— મુખ્ય વિભાગની પૃષ્ઠભૂમિ, વધારાની સપાટીનો છાંયો, મોટા સંપાદકીય પેનલ. - Olive Char
#222519— ગૌણ UI ઘટકો, વિભાજકો અને મ્યૂટ કરેલા લેબલ્સ માટે તટસ્થ રંગ સપોર્ટેડ છે. કૉલ્સ ટુ એક્શન માટે તેનો પ્રાથમિક રંગ તરીકે ઉપયોગ થવો જોઈએ નહીં. - Iron Gray
#525252— ગૌણ લખાણ, સહાયક લખાણ, સ્વાભાવિક ફ્રેમ્સ.
ટાઇપોગ્રાફી
૧૨ થી ૪૦ પિક્સેલ સુધી · ૬ પગલાં
- Self Modern — રિપ્લેસમેન્ટ: Playfair Display · રૂપરેખા 400 · મુખ્ય શબ્દસમૂહો અને સંગ્રહના શીર્ષકોને પ્રકાશિત કરીને, હેડલાઇન્સ અને સંપાદકીયનો ઉપયોગ ઓછો કરવામાં આવ્યો છે. સેરીફ અને ઇટાલિક ટાઇપફેસ સેન્સ-સેરીફ ટાઇપફેસની એકવિધતાને તોડી નાખે છે અને સંદેશ આપે છે: "આ વાર્તાનો સાર છે."
- Geograph — રિપ્લેસમેન્ટ: Inter · રૂપરેખા 400, 500, 700 · યુઝર ઇન્ટરફેસ માટેના પ્રાથમિક ફોન્ટમાં બોડી ટેક્સ્ટ, નેવિગેશન લેબલ્સ, બટનો, પ્રોડક્ટ હેડિંગ, ફૂટર, ઇનપુટ ફીલ્ડ અને આઇકોનનો સમાવેશ થાય છે. હાઇલાઇટ કરેલા હેડિંગ માટે 500, પ્રોડક્ટ નામો માટે 700. નેવિગેશન લેબલ્સ અને શ્રેણીઓમાં મોટા અક્ષરોમાં પહોળા અક્ષર અંતર (0.025em–0.10em) એક સુસંગત બ્રાન્ડ શૈલી સ્થાપિત કરે છે.
- HurmeGeometricSans3 — રિપ્લેસમેન્ટ: Inter · રૂપરેખા 400 · ભાગ્યે જ બટન માટે બેકઅપ અથવા સમર્પિત લેબલ તરીકે ઉપયોગમાં લેવાય છે. જિયોગ્રાફ આ સિસ્ટમનો દરરોજ ઉપયોગ કરે છે.
અંતરાલો અને સ્વરૂપ
| હેતુ | અર્થ |
|---|---|
| ઘનતા | ગાઢ |
| મૂળભૂત પગલું | 8-16px |
| બટન ત્રિજ્યા | 9999px (pill) |
| કાર્ડ ત્રિજ્યા | 16px |
| પડછાયાઓ | પડછાયાને બદલે ના - સરહદો |
| વિભાગો વચ્ચે | 40-56px |
| પૃષ્ઠ પહોળાઈ | 1200px |
AI તમારી વેબસાઇટ Allbirds શૈલીમાં બનાવશે અને તેને ભરી દેશે.
- લિંક દ્વારા ઉત્પાદનો અને પોસ્ટ્સ ભરો - Instagram, TikTok, Facebook.
- તમારી જૂની સાઇટ પરથી સામગ્રી ટ્રાન્સફર કરો—ફક્ત સરનામું સ્પષ્ટ કરો.
- શ્રેષ્ઠ એન્જિન પર આધુનિક ડિઝાઇન: સર્વર રેન્ડરિંગ અને SEO ઑપ્ટિમાઇઝેશન સાથે React ( Next.js).
- શોધ પરિણામો અને ન્યુરલ નેટવર્ક ભલામણો માટે સંપૂર્ણપણે સ્વચાલિત SEO ઑપ્ટિમાઇઝેશન.
સમાન શૈલીઓ
- Lightship — ખુલ્લા રસ્તાનો સિનેમેટિક ડાયોરામા. ગરમ ક્રીમ ગેલેરીની દિવાલો, જે મોટા લેન્ડસ્કેપ ફોટોગ્રાફ્સથી શણગારેલી છે, ફ્રેમ પર ભાગ્યે જ દેખાતી પાતળી કાળી શૈલી, અને એક તેજસ્વી નારંગી રંગ જે ઘાસના મેદાનમાં અગ્નિની જેમ મોનોક્રોમને તોડી નાખે છે.
- Faire ES — ગરમ ક્રીમની જથ્થાબંધ સૂચિ
- Adanola — સફેદ કાગળ પર એક સંપાદકીય લુકબુક. એક ફેશન શૂટ જ્યાં ટાઇપોગ્રાફી અને ફોટોગ્રાફી સ્વચ્છ સફેદ સપાટી પર શ્વાસ લે છે, ટાઇપફેસ માટે કાળી શાહી અને સૂક્ષ્મ સિગ્નેચર સેન્સ-સેરીફ ફોન્ટ (મનપસંદ) સાથે, બ્રાન્ડની એકંદર શૈલીને પ્રતિબિંબિત કરે છે.
- Oura Ring — નરમ દિવસના પ્રકાશમાં સ્નાન કરતી હૂંફાળું ઓટમીલ બનાવવાની વર્કશોપ
- Stykka — સફેદ પ્રકાશમાં સ્કેન્ડિનેવિયન વર્કશોપ - એક શાંત, હાથથી બનાવેલ શોરૂમ જ્યાં એકમાત્ર અવાજ ફોટોગ્રાફીનો છે.
- DJI — સિંગલ ઇલેક્ટ્રિક બ્લુ હાઇલાઇટ સાથે એરોસ્પેસ બ્લેક કેનવાસ
- Altitude Beverages — મોનોક્રોમ મેગેઝિનનો ફેલાવો. કલ્પના કરો કે એક ફેશન મેગેઝિનનો ફેલાવો જેમાં સ્થિર ફોટા સિવાય બધા રંગોનો સમાવેશ થતો નથી - ટેક્સ્ટ અને સફેદ જગ્યા આખી વાર્તા કહે છે.
- AATHER — ખુલ્લી હથેળી, એક જ જ્યોત - સ્થિરતામાં સમાયેલ શાંત વૈભવ
- Cowboy — બરફ-સફેદ પોર્સેલિન સેટિંગમાં બેલ્જિયન સાયકલ ગેલેરી. એક શોરૂમ જ્યાં મેટ સપાટીઓ, સંપાદકીય સામગ્રીમાં વપરાતા મોટા ફોન્ટ્સ અને સુશોભનનો વર્ચ્યુઅલ અભાવ સાયકલ અને તેની સામગ્રી તરફ ધ્યાન ખેંચે છે.
- Refero — સફેદ આરસપહાણ પર સંપાદકીય લેઆઉટ - એક ટાઇપોગ્રાફર દ્વારા બનાવેલ ઉત્પાદન પૃષ્ઠ, જ્યાં સેરીફ હેડલાઇન બ્રાન્ડનું કૉલિંગ કાર્ડ છે, અને બાકીનું બધું સ્વાભાવિક છે.
- Face Formula — સ્કેન્ડિનેવિયન સંપાદકીય ચિત્ર. શાંત, મેગેઝિન-શૈલીનો ફેલાવો, જ્યાં મોડેલની નજર અને હેડલાઇન, સંક્ષિપ્ત સેરીફ ફોન્ટમાં લખાયેલ, ઠંડી, ધુમ્મસવાળી પૃષ્ઠભૂમિ સામે પોતાને માટે બોલે છે.
- Shupatto — સફેદ આરસપહાણ પર મ્યુઝિયમ ડિસ્પ્લે કેસ