FRANKY'S
ਸਕੇਟ ਦੀ ਦੁਕਾਨ ਦੇ ਕਾਊਂਟਰ 'ਤੇ ਇੱਕ ਰੈਟਰੋ ਗੇਮਿੰਗ ਕਿਓਸਕ
ਫ੍ਰੈਂਕੀ ਦੀ ਵਿਜ਼ੂਅਲ ਭਾਸ਼ਾ ਰੈਟਰੋ ਆਰਕੇਡ ਅਤੇ ਸਕੇਟਬੋਰਡ ਸ਼ਾਪ ਦਾ ਸੁਮੇਲ ਹੈ: ਇੱਕ ਗਰਮ ਕਰੀਮ ਕੈਨਵਸ (#f3e5df) ਜੋ ਸਖ਼ਤ ਪਿਕਸਲ ਬਾਰਡਰਾਂ ਦੁਆਰਾ ਬਣਾਇਆ ਗਿਆ ਹੈ, ਇੱਕ ਸਰਵ ਵਿਆਪਕ ਕਾਲਾ-ਚਿੱਟਾ ਚੈਕਰਬੋਰਡ, ਅਤੇ ਇੱਕ ਸਿੰਗਲ ਪਿਕਸਲ ਫੌਂਟ, ਆਰਕੇਡ, ਜੋ ਵੈੱਬਸਾਈਟ 'ਤੇ ਹਰੇਕ ਸ਼ਬਦ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਪੈਲੇਟ ਜਾਣਬੁੱਝ ਕੇ ਵਿਰਲ ਹੈ—ਸਿਰਫ਼ ਦੋ ਰੰਗੀਨ ਰੰਗ ਬਚੇ ਹਨ (ਸਾਈਨ ਲਈ ਸਿਗਨਲ ਸੰਤਰੀ #faa21f ਅਤੇ ਖਰੀਦ ਬਟਨ ਲਈ ਅਮੀਰ ਹਰਾ #128e44), ਪੂਰੇ ਦਰਜੇਬੰਦੀ ਨੂੰ ਆਰਕੇਡ ਫੌਂਟ ਭਾਰ ਨੂੰ 400 ਤੋਂ 700 ਤੱਕ ਵਧਾ ਕੇ ਅਤੇ ਕਰੀਮ ਬੈਕਗ੍ਰਾਊਂਡ ਦੇ ਵਿਰੁੱਧ ਕਾਲੇ ਰੰਗ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਦਰਸਾਇਆ ਗਿਆ ਹੈ। ਸਤ੍ਹਾ ਸਮਤਲ ਅਤੇ ਮੋਨੋਲਿਥਿਕ ਰਹਿੰਦੀਆਂ ਹਨ; ਡੂੰਘਾਈ ਸਿਰਫ ਬਟਨਾਂ 'ਤੇ ਪਾਈ ਗਈ 1px ਕਰੀਮ ਲਾਈਨ ਅਤੇ ਚੈਕਰਬੋਰਡ ਦੇ ਟੋਨਲ ਪਲੇ ਦੁਆਰਾ ਪ੍ਰਾਪਤ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਹਿੱਸੇ 1990 ਦੇ ਦਹਾਕੇ ਦੇ ਸਟੋਰਫਰੰਟ ਸਪ੍ਰਾਈਟਸ ਦੀ ਯਾਦ ਦਿਵਾਉਂਦੇ ਹਨ: ਮੋਟੇ ਕਾਲੇ ਬਾਰਡਰ, ਤੰਗ 6-12px ਬਾਰਡਰ ਰੇਡੀਆਈ, ਸੰਖੇਪ 4-8px ਪੈਡਿੰਗ, ਅਤੇ 3D/AR ਟੌਗਲ ਜੋ ਕ੍ਰੋਮ ਐਲੀਮੈਂਟਸ ਦੀ ਬਜਾਏ ਪਿਕਸਲੇਟਿਡ ਆਈਕਨਾਂ ਵਾਂਗ ਦਿਖਾਈ ਦਿੰਦੇ ਹਨ। ਨਵੇਂ ਪੰਨੇ ਆਰਕੇਡ ਵਰਗੇ ਮਾਹੌਲ ਨੂੰ ਬਣਾਈ ਰੱਖਣ ਲਈ ਹਨ: ਸੰਤਰੀ ਸਕ੍ਰੌਲਿੰਗ ਟੈਕਸਟ ਤੋਂ ਇਲਾਵਾ ਕੋਈ ਗਰੇਡੀਐਂਟ ਨਹੀਂ, ਕੋਈ ਨਰਮ ਪਰਛਾਵਾਂ ਨਹੀਂ, ਕੋਈ ਸਜਾਵਟੀ ਟਾਈਪੋਗ੍ਰਾਫੀ ਨਹੀਂ—ਸਿਰਫ਼ ਕਰੀਮ ਰੰਗ ਦਾ ਕਾਗਜ਼, ਕਾਲੀਆਂ ਪਿਕਸਲੇਟਿਡ ਲਾਈਨਾਂ, ਅਤੇ ਇੱਕ ਗਰਮ ਸੰਤਰੀ ਰੰਗ।
ਡੈਸਕਟੌਪ 'ਤੇ, ਉਤਪਾਦ ਪੰਨਾ 1200px ਦੀ ਵੱਧ ਤੋਂ ਵੱਧ ਚੌੜਾਈ ਦੇ ਨਾਲ ਇੱਕ ਪੂਰੀ-ਚੌੜਾਈ, ਕੇਂਦਰਿਤ ਲੇਆਉਟ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ। ਉੱਪਰ ਤੋਂ ਹੇਠਾਂ ਤੱਕ ਤਾਲ ਇਹ ਹੈ: ਸੰਤਰੀ ਸਕ੍ਰੌਲਿੰਗ ਟੈਕਸਟ → ਕਾਲੀ ਲਾਈਨ ਦੇ ਨਾਲ ਕਰੀਮ-ਰੰਗ ਦਾ ਹੈਡਰ → ਦੋ-ਕਾਲਮ ਸਪਲਿਟ (ਹੋਮਪੇਜ 'ਤੇ 55% ਚੈਕਰਬੋਰਡ / ਉਤਪਾਦ ਕਾਰਡਾਂ ਦਾ 45% ਦੋ-ਕਾਲਮ ਗਰਿੱਡ) → ਫੁੱਟਰ ਵਿੱਚ ਕਰੀਮ-ਰੰਗੀ ਸਟ੍ਰਾਈਪ। ਮੋਬਾਈਲ 'ਤੇ, ਹੋਮਪੇਜ ਇੱਕ ਪੂਰੀ-ਚੌੜਾਈ ਵਾਲੇ ਚੈਕਰਬੋਰਡ ਵਿੱਚ ਢਹਿ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਗਰਿੱਡ ਇੱਕ ਸਿੰਗਲ-ਕਾਲਮ ਲੇਆਉਟ ਬਣ ਜਾਂਦਾ ਹੈ। ਕਾਰਡਾਂ ਨੂੰ ਦੋ-ਕਾਲਮ ਗਰਿੱਡ ਵਿੱਚ ਬਰਾਬਰ ਵੰਡਿਆ ਜਾਂਦਾ ਹੈ ਜਿਸ ਵਿੱਚ ਸਲੇਟੀ ਪਿਕਸਲ (#e5e7eb) ਡਿਵਾਈਡਰ ਹੁੰਦੇ ਹਨ। ਭਾਗਾਂ ਵਿਚਕਾਰ ਸਪੇਸਿੰਗ ਘੱਟੋ-ਘੱਟ (43–61px) ਹੈ, ਅਤੇ ਇੰਟਰਫੇਸ ਕਦੇ ਵੀ ਗੂੜ੍ਹੀਆਂ ਧਾਰੀਆਂ ਦੀ ਵਰਤੋਂ ਨਹੀਂ ਕਰਦਾ ਜੋ ਪੰਨੇ ਦੀ ਪੂਰੀ ਚੌੜਾਈ ਨੂੰ ਫੈਲਾਉਂਦੀਆਂ ਹਨ—ਕਰੀਮ ਕੈਨਵਸ ਬਿਨਾਂ ਕਿਸੇ ਰੁਕਾਵਟ ਦੇ ਪ੍ਰਦਰਸ਼ਿਤ ਹੁੰਦਾ ਹੈ।
ਸਾਫ਼ ਕਰੀਮ ਬੈਕਗ੍ਰਾਊਂਡ ਦੇ ਵਿਰੁੱਧ ਕੈਪਸ ਦੀ ਇੱਕ ਫੋਟੋ, ਕੇਂਦਰਿਤ ਅਤੇ ਕੱਸ ਕੇ ਕੱਟੀ ਹੋਈ, ਹੇਠਾਂ ਇੱਕ ਨਰਮ, ਚਾਰਕੋਲ-ਕਾਲਾ ਪਰਛਾਵਾਂ ਹੈ। ਕੋਈ ਜੀਵਨ ਸ਼ੈਲੀ ਨਹੀਂ, ਕੋਈ ਮਾਡਲ ਨਹੀਂ, ਕੋਈ ਸੰਦਰਭ ਨਹੀਂ - ਟੋਪੀ ਤਾਰਾ ਹੈ। ਮੁੱਖ ਤੱਤ ਦੇ ਪਿੱਛੇ ਇੱਕ ਚੈਕਰਬੋਰਡ ਪੈਟਰਨ ਗ੍ਰਾਫਿਕ ਸਤਹ ਵਜੋਂ ਕੰਮ ਕਰਦਾ ਹੈ। ਕੋਈ ਚਿੱਤਰ ਨਹੀਂ, ਕੋਈ 3D ਰੈਂਡਰ ਨਹੀਂ ਸਿਵਾਏ ਵਧੇ ਹੋਏ ਰਿਐਲਿਟੀ ਟੌਗਲ ਦੇ, ਲੋਗੋ ਵਿੱਚ ਪਿਕਸਲੇਟਿਡ ਕਰਾਸ ਤੋਂ ਇਲਾਵਾ ਕੋਈ ਸਜਾਵਟੀ ਆਈਕਨ ਨਹੀਂ।
ਪੈਲੇਟ
ਬ੍ਰਾਂਡ
- Marquee Orange
#faa21f— ਸਕ੍ਰੀਨ ਦੇ ਸਿਖਰ 'ਤੇ ਨੋਟੀਫਿਕੇਸ਼ਨ ਬਾਰ, ਐਕਸੈਂਟ ਐਲੀਮੈਂਟਸ, ਬ੍ਰਾਂਡਿੰਗ। - Buy Green
#128e44— "ਕਾਰਟ ਵਿੱਚ ਸ਼ਾਮਲ ਕਰੋ" ਬਟਨ ਭਰਿਆ ਹੋਇਆ ਹੈ - ਹਰੇ ਰੰਗ ਵਿੱਚ ਚਿੰਨ੍ਹਿਤ ਇੱਕੋ ਇੱਕ ਖਰੀਦ ਕਾਰਵਾਈ।
ਨਿਰਪੱਖ
- Arcade Cream
#f3e5df— ਪੰਨੇ ਦੀ ਪਿੱਠਭੂਮੀ, ਉਤਪਾਦ ਕਾਰਡ ਸਤ੍ਹਾ, ਬਟਨ ਇਨਸਰਟਸ। - Ink Black
#000000— ਮੁੱਖ ਟੈਕਸਟ, ਚੈਕਰਬੋਰਡ ਲੇਆਉਟ, ਸਾਰੇ UI ਬਾਰਡਰ, ਕਾਰਡ ਰੂਪਰੇਖਾ, ਆਈਕਨ ਬਾਰਡਰ। - Pixel Gray
#e5e7eb— ਪਤਲੇ ਬਾਰਡਰ, ਕਾਰਡ ਡਿਵਾਈਡਰ, ਗਰਿੱਡ ਸੈੱਲਾਂ ਵਿਚਕਾਰ ਢਾਂਚਾਗਤ ਨਿਯਮ। - Charcoal
#333333— ਸੈਕੰਡਰੀ ਸਤਹ ਟੋਨ, ਚੈਕਰਬੋਰਡ ਸ਼ੈਡੋ ਵਰਗ, ਸ਼ੈਡੋ ਰੰਗ - Carbon
#151515— ਚਿੱਤਰਾਂ ਨੂੰ ਭਰਨ ਲਈ ਅਮੀਰ ਨਿਰਪੱਖ ਸੁਰਾਂ ਅਤੇ ਸਭ ਤੋਂ ਸੰਘਣੀ ਚੈਕਰਬੋਰਡ ਟਾਈਲਾਂ। - Muted Gray
#737373— ਬਟਨਾਂ ਅਤੇ ਮੁੱਖ ਟੈਕਸਟ ਵਿੱਚ ਟੈਕਸਟ ਨੂੰ ਅਯੋਗ/ਮਿਊਟ ਕੀਤਾ ਗਿਆ ਹੈ।
ਟਾਈਪੋਗ੍ਰਾਫੀ
10 ਤੋਂ 18px ਤੱਕ · 4 ਕਦਮ
- Arcade — ਬਦਲ: VT323 · ਰੂਪਰੇਖਾ 400, 700 · ਪੂਰੇ ਇੰਟਰਫੇਸ ਵਿੱਚ ਇੱਕ ਹੀ ਫੌਂਟ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ—ਸਾਰੇ ਸਿਰਲੇਖ, ਲੇਬਲ, ਕੀਮਤਾਂ, ਬਟਨ, ਬਾਡੀ ਟੈਕਸਟ, ਅਤੇ ਆਈਕਨ ਆਰਕੇਡ ਵਿੱਚ ਹਨ। 400 ਤੋਂ 700 ਤੱਕ ਤਬਦੀਲੀ ਹੀ ਦਰਜਾਬੰਦੀ ਬਣਾਉਣ ਦਾ ਇੱਕੋ ਇੱਕ ਸਾਧਨ ਹੈ; ਦੂਜੇ ਫੌਂਟ ਦੀ ਵਰਤੋਂ ਕਰਨ ਨਾਲ ਕਿਓਸਕ ਭਰਮ ਖਤਮ ਹੋ ਜਾਵੇਗਾ।
ਅੰਤਰਾਲ ਅਤੇ ਰੂਪ
| ਉਦੇਸ਼ | ਭਾਵ |
|---|---|
| ਘਣਤਾ | ਸੰਘਣਾ |
| ਮੁੱਢਲਾ ਕਦਮ | 4-8px |
| ਬਟਨ ਦਾ ਘੇਰਾ | 6px |
| ਕਾਰਡ ਦਾ ਘੇਰਾ | 12px |
| ਪਰਛਾਵੇਂ | ਪਰਛਾਵਿਆਂ ਦੀ ਬਜਾਏ ਕੋਈ - ਬਾਰਡਰ ਨਹੀਂ |
| ਭਾਗਾਂ ਵਿਚਕਾਰ | 43-61px |
| ਪੰਨੇ ਦੀ ਚੌੜਾਈ | 1200px |
AI ਤੁਹਾਡੀ ਵੈੱਬਸਾਈਟ ਨੂੰ FRANKY'S ਸ਼ੈਲੀ ਵਿੱਚ ਬਣਾਏਗਾ ਅਤੇ ਇਸਨੂੰ ਭਰ ਦੇਵੇਗਾ।
- ਲਿੰਕ ਰਾਹੀਂ ਉਤਪਾਦਾਂ ਅਤੇ ਪੋਸਟਾਂ ਨਾਲ ਭਰੋ - Instagram, TikTok, Facebook ।
- ਆਪਣੀ ਪੁਰਾਣੀ ਸਾਈਟ ਤੋਂ ਸਮੱਗਰੀ ਟ੍ਰਾਂਸਫਰ ਕਰੋ—ਬੱਸ ਪਤਾ ਦੱਸੋ।
- ਸਭ ਤੋਂ ਵਧੀਆ ਇੰਜਣ 'ਤੇ ਆਧੁਨਿਕ ਡਿਜ਼ਾਈਨ: ਸਰਵਰ ਰੈਂਡਰਿੰਗ ਅਤੇ SEO ਔਪਟੀਮਾਈਜੇਸ਼ਨ ਦੇ ਨਾਲ React ( Next.js)।
- ਖੋਜ ਨਤੀਜਿਆਂ ਅਤੇ ਨਿਊਰਲ ਨੈੱਟਵਰਕ ਸਿਫ਼ਾਰਸ਼ਾਂ ਲਈ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਵੈਚਾਲਿਤ SEO ਅਨੁਕੂਲਤਾ।
ਮਿਲਦੇ-ਜੁਲਦੇ ਸਟਾਈਲ
- 099 SUPPLY — ਕਾਲੀਆਂ ਅਤੇ ਚਿੱਟੀਆਂ ਚੀਜ਼ਾਂ ਨਾਲ ਭਰੀ ਇੱਕ ਗੈਲਰੀ ਦੀਵਾਰ
- teenage engineering — ਸਟੂਡੀਓ ਲਾਈਟਿੰਗ ਵਿੱਚ ਉਦਯੋਗਿਕ ਕੈਟਾਲਾਗ - ਉਤਪਾਦ ਪੰਨੇ 'ਤੇ ਇੱਕੋ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਵਸਤੂ ਹੈ, ਅਤੇ ਬਾਕੀ ਸਭ ਕੁਝ ਇਸਦੇ ਆਲੇ-ਦੁਆਲੇ ਚਰਚਾ ਕੀਤਾ ਜਾਂਦਾ ਹੈ।
- Custo — ਇੱਕ ਮੋਨੋਲਿਥਿਕ ਫੌਂਟ ਵਾਲੀ ਗਨਮੈਟਲ-ਰੰਗ ਦੀ ਗੈਲਰੀ। ਮਿਊਟ ਸਲੇਟੀ-ਹਰੇ ਟੋਨਾਂ ਵਿੱਚ ਇੱਕ ਸ਼ੋਅਰੂਮ, ਜਿੱਥੇ ਇੱਕ ਸਿੰਗਲ ਗੂੜ੍ਹੀ ਵਸਤੂ ਅਤੇ 57px ਫੌਂਟ ਆਪਣੇ ਆਪ ਬੋਲਦੇ ਹਨ।
- Walden — ਜੰਗਲ ਦੇ ਫ਼ਰਸ਼ ਦੀ ਚੁੱਪ - ਹਰ ਉਤਪਾਦ ਇੱਕ ਪੱਥਰ ਹੈ, ਹਰ ਪਿਕਸਲ ਕਾਈ ਅਤੇ ਚੁੱਪ ਹੈ।
- Fiverr — ਡਿਜੀਟਲ ਬਾਜ਼ਾਰ ਦਾ ਕੇਂਦਰ ਬਿੰਦੂ ਹਨੇਰੇ ਥੀਏਟਰ ਸਟੇਜਾਂ ਦੇ ਵਿਰੁੱਧ ਇੱਕ ਜੀਵੰਤ ਹਰਾ ਪਲਸ ਹੈ। ਇੱਕ ਸਿੰਗਲ ਨਿਓਨ ਹਰਾ ਬਿੰਦੀ ਲੋਗੋ ਲਈ ਇੱਕ ਐਂਕਰ ਵਜੋਂ ਕੰਮ ਕਰਦੀ ਹੈ; ਬਾਕੀ ਮੋਨੋਕ੍ਰੋਮ ਹੈ, ਜੋ ਪੇਸ਼ ਕੀਤੀਆਂ ਜਾਂਦੀਆਂ ਸੇਵਾਵਾਂ ਦੀ ਅਪੀਲ ਨੂੰ ਉਜਾਗਰ ਕਰਨ ਲਈ ਤਿਆਰ ਕੀਤਾ ਗਿਆ ਹੈ।
- Peloton — ਜੈੱਟ-ਕਾਲੇ ਰਨਵੇਅ 'ਤੇ ਇੱਕ ਲਾਲ ਬੱਤੀ। ਇੱਕ ਫਿਟਨੈਸ ਸ਼ੋਅਰੂਮ ਜਿੱਥੇ ਇੱਕ ਚਮਕਦਾਰ ਲਾਲ CTA ਸਾਈਨ ਵਿਸ਼ਾਲ, ਹਨੇਰੇ ਪ੍ਰਦਰਸ਼ਨੀ ਵਾਲੀ ਜਗ੍ਹਾ ਵਿੱਚੋਂ ਲੰਘਦਾ ਹੈ ਅਤੇ ਸਾਫ਼, ਚਿੱਟੇ ਉਤਪਾਦ ਕਮਰਿਆਂ ਵੱਲ ਲੈ ਜਾਂਦਾ ਹੈ।
- HOUSEPLANT — ਲਿਨਨ ਦੇ ਕਾਗਜ਼ 'ਤੇ ਗਿਰੀਆਂ ਵਾਲੀ ਇੱਕ ਕਿਤਾਬਾਂ ਦੀ ਦੁਕਾਨ
- Adam Lippes — ਕਰੀਮ ਪੇਪਰ 'ਤੇ ਇੱਕ ਮੋਨੋਕ੍ਰੋਮ ਸੰਪਾਦਕੀ ਸਟੂਡੀਓ - ਇੱਕ ਵੋਗ ਫੈਲਾਅ ਜਿੱਥੇ ਸਿਰਫ਼ ਲੇਆਉਟ ਗਰਿੱਡ ਹੀ ਸਜਾਵਟ ਹੈ, ਰੰਗ ਪੈਲੇਟ ਨਹੀਂ।
- Elektron — ਅੱਧੀ ਰਾਤ ਨੂੰ ਉਪਕਰਣ ਕੰਟਰੋਲ ਪੈਨਲ ਲਗਭਗ ਕਾਲਾ ਕੈਨਵਸ ਹੁੰਦਾ ਹੈ, ਜਿੱਥੇ ਉਤਪਾਦ ਦੀਆਂ ਫੋਟੋਆਂ ਚਮਕਦੀਆਂ ਹਨ ਜਦੋਂ ਕਿ ਇੰਟਰਫੇਸ ਲਗਭਗ ਅਦਿੱਖ ਰਹਿੰਦਾ ਹੈ।
- Sigmaphoto — ਮੋਨੋਕ੍ਰੋਮ ਗੈਲਰੀ ਆਫ਼ ਪ੍ਰਿਸੀਜ਼ਨ ਇੰਸਟਰੂਮੈਂਟਸ ਇੱਕ ਸ਼ਾਂਤ ਚਿੱਟਾ ਕਮਰਾ ਹੈ ਜਿੱਥੇ ਸਿਰਫ਼ ਉਹ ਰੰਗ ਮਾਇਨੇ ਰੱਖਦਾ ਹੈ ਜੋ ਤੁਹਾਨੂੰ ਕਾਰਵਾਈ ਲਈ ਬੁਲਾਉਂਦਾ ਹੈ।
- Channel Studio — ਇੱਕ ਕੋਰਲ ਲੈਂਪਸ਼ੇਡ ਵਾਲੀ ਇੱਕ ਸਟੂਡੀਓ ਫੋਟੋ ਲੈਬ
- Specht Studio — ਇੱਕ ਗੈਲਰੀ ਦੀਵਾਰ ਜੋ ਕਿ ਸੂਝਵਾਨ ਉਤਸੁਕਤਾ ਨਾਲ ਭਰੀ ਹੋਈ ਹੈ। ਸਟੂਡੀਓ ਦੀ ਆਪਣੀ ਕ੍ਰੋਮ ਫਿਨਿਸ਼ ਇੱਕ ਚਿੱਟੀ ਸਤ੍ਹਾ ਅਤੇ ਕਾਲੇ ਅੱਖਰਾਂ ਵਾਲੀ ਹੈ; ਵਿਜ਼ੂਅਲ ਆਤਿਸ਼ਬਾਜ਼ੀ ਪੂਰੀ ਤਰ੍ਹਾਂ ਪ੍ਰੋਜੈਕਟ ਦੇ ਟਾਈਲਵਰਕ ਦੇ ਅੰਦਰ ਕੇਂਦ੍ਰਿਤ ਹੈ।