FRANKY'S
একটি স্কেট শপের কাউন্টারে একটি রেট্রো গেমিং কিয়স্ক
ফ্র্যাঙ্কির ভিজ্যুয়াল ল্যাঙ্গুয়েজ হলো রেট্রো আর্কেড এবং স্কেটবোর্ড শপের একটি সংমিশ্রণ: দৃঢ় পিক্সেল বর্ডার দ্বারা ঘেরা একটি উষ্ণ ক্রিম ক্যানভাস (#f3e5df), সর্বত্র বিরাজমান একটি সাদা-কালো চেকারবোর্ড, এবং ওয়েবসাইটের প্রতিটি শব্দে ব্যবহৃত আর্কেড নামের একটি সিঙ্গেল পিক্সেল ফন্ট। রঙের প্যালেটটি ইচ্ছাকৃতভাবে সীমিত—মাত্র দুটি বর্ণময় রঙ রাখা হয়েছে (সাইনবোর্ডের জন্য সিগন্যাল অরেঞ্জ #faa21f এবং বাই বাটনের জন্য গাঢ় সবুজ #128e44), এবং সম্পূর্ণ হায়ারার্কিটি প্রকাশ করা হয়েছে আর্কেড ফন্টের ওয়েট ৪০০ থেকে বাড়িয়ে ৭০০ করার মাধ্যমে ও ক্রিম ব্যাকগ্রাউন্ডের বিপরীতে কালো রঙ ব্যবহার করে। পৃষ্ঠতলগুলো সমতল এবং অখণ্ড থাকে; গভীরতা আনা হয় শুধুমাত্র বাটনগুলোতে বসানো ১ পিক্সেলের ক্রিম লাইন এবং চেকারবোর্ডের রঙের বৈচিত্র্যের মাধ্যমে। উপাদানগুলো ১৯৯০-এর দশকের দোকানের স্প্রাইটগুলোর কথা মনে করিয়ে দেয়: মোটা কালো বর্ডার, ৬-১২ পিক্সেলের আঁটসাঁট বর্ডার রেডিয়াস, ৪-৮ পিক্সেলের কম্প্যাক্ট প্যাডিং এবং ৩ডি/এআর টগল, যেগুলো ক্রোম এলিমেন্টের পরিবর্তে পিক্সেলযুক্ত আইকনের মতো দেখায়। নতুন পেজগুলোতে আর্কেড-সদৃশ পরিবেশ বজায় রাখার উদ্দেশ্য রয়েছে: কমলা রঙের স্ক্রলিং টেক্সট ছাড়া অন্য কোনো গ্রেডিয়েন্ট নেই, কোনো সফট শ্যাডো নেই, কোনো আলংকারিক টাইপোগ্রাফি নেই—কেবল ক্রিম রঙের কাগজ, কালো পিক্সেলযুক্ত লাইন এবং একটিমাত্র উষ্ণ কমলা রঙ।
ডেস্কটপে, প্রোডাক্ট পেজটি একটি সম্পূর্ণ-প্রস্থের, কেন্দ্র-সারিবদ্ধ লেআউট প্রদর্শন করে, যার সর্বোচ্চ প্রস্থ ১২০০ পিক্সেল। উপর থেকে নীচের ক্রমটি হলো: কমলা রঙের স্ক্রলিং টেক্সট → একটি কালো রেখা সহ ক্রিম-রঙের হেডার → দুই-কলামে বিভক্ত (হোমপেজে ৫৫% চেকারবোর্ড / প্রোডাক্ট কার্ডের ৪৫% দুই-কলাম গ্রিড) → ফুটারে ক্রিম-রঙের স্ট্রাইপ। মোবাইলে, হোমপেজটি একটি সম্পূর্ণ-প্রস্থের চেকারবোর্ডে সংকুচিত হয়ে যায় এবং গ্রিডটি একটি একক-কলাম লেআউটে পরিণত হয়। কার্ডগুলো একটি দুই-কলামের গ্রিডে সমানভাবে বিন্যস্ত থাকে এবং সেগুলোর মধ্যে ধূসর পিক্সেল (#e5e7eb) ডিভাইডার থাকে। সেকশনগুলোর মধ্যে ব্যবধান খুবই কম (৪৩–৬১ পিক্সেল), এবং ইন্টারফেসটি কখনোই পেজের সম্পূর্ণ প্রস্থ জুড়ে থাকা কোনো কালো স্ট্রাইপ ব্যবহার করে না—ক্রিম ক্যানভাসটি কোনো বাধা ছাড়াই প্রদর্শিত হয়।
একটি পরিষ্কার ক্রিম রঙের পটভূমিতে রাখা ক্যাপের একটি ছবি, যা কেন্দ্রে রেখে নিবিড়ভাবে ক্রপ করা হয়েছে এবং এর নিচে একটি নরম, গাঢ় কালো ছায়া রয়েছে। কোনো লাইফস্টাইল নেই, কোনো মডেল নেই, কোনো প্রেক্ষাপটও নেই—ক্যাপটিই এখানে প্রধান আকর্ষণ। মূল উপাদানটির পেছনের একটি চেকারবোর্ড প্যাটার্ন গ্রাফিক পৃষ্ঠ হিসেবে কাজ করে। অগমেন্টেড রিয়েলিটি টগলটি ছাড়া কোনো ইলাস্ট্রেশন বা থ্রিডি রেন্ডার নেই, এবং লোগোর পিক্সেলযুক্ত ক্রসটি ছাড়া অন্য কোনো আলংকারিক আইকনও নেই।
প্যালেট
ব্র্যান্ড
- Marquee Orange
#faa21f— স্ক্রিনের শীর্ষে নোটিফিকেশন বার, অ্যাকসেন্ট এলিমেন্টস, ব্র্যান্ডিং। - Buy Green
#128e44— ‘কার্টে যোগ করুন’ বাটনটি পূরণ করা আছে - এটিই একমাত্র ক্রয়ের ধাপ যা সবুজ রঙে চিহ্নিত।
নিরপেক্ষ
- Arcade Cream
#f3e5df— পৃষ্ঠার পটভূমি, পণ্য কার্ডের পৃষ্ঠতল, বোতাম সন্নিবেশ। - Ink Black
#000000— মূল লেখা, চেকারবোর্ড লেআউট, সমস্ত UI বর্ডার, কার্ডের আউটলাইন, আইকনের বর্ডার। - Pixel Gray
#e5e7eb— পাতলা বর্ডার, কার্ড বিভাজক, গ্রিড সেলগুলোর মধ্যে কাঠামোগত রেখা। - Charcoal
#333333— গৌণ পৃষ্ঠের টোন, চেকারবোর্ড ছায়া বর্গক্ষেত্র, ছায়ার রঙ - Carbon
#151515— চিত্রাঙ্কন এবং সবচেয়ে ঘন চেকারবোর্ড টাইলস পূরণের জন্য গাঢ় নিরপেক্ষ রঙ। - Muted Gray
#737373— বোতামে এবং মূল লেখায় নিষ্ক্রিয়/নিঃশব্দ টেক্সট
টাইপোগ্রাফি
১০ থেকে ১৮ পিক্সেল · ৪ ধাপ
- Arcade — প্রতিস্থাপন: VT323 · রূপরেখা 400, 700 · পুরো ইন্টারফেস জুড়ে একটিই ফন্ট ব্যবহার করা হয়েছে—সমস্ত শিরোনাম, লেবেল, মূল্য, বাটন, মূল লেখা এবং আইকন আর্কেড ফন্টে রয়েছে। স্তরবিন্যাস তৈরির একমাত্র উপায় হলো ৪০০ থেকে ৭০০-তে রূপান্তর; দ্বিতীয় কোনো ফন্ট ব্যবহার করলে কিয়স্কের আবহটি নষ্ট হয়ে যাবে।
ব্যবধান এবং ফর্ম
| উদ্দেশ্য | অর্থ |
|---|---|
| ঘনত্ব | ঘন |
| প্রাথমিক পদক্ষেপ | 4-8px |
| বোতামের ব্যাসার্ধ | 6px |
| কার্ডের ব্যাসার্ধ | 12px |
| ছায়া | না - ছায়ার পরিবর্তে সীমানা |
| বিভাগগুলির মধ্যে | 43-61px |
| পৃষ্ঠার প্রস্থ | 1200px |
এআই আপনার ওয়েবসাইটটি FRANKY'S স্টাইলে তৈরি করবে এবং তাতে তথ্য যোগ করবে।
- Instagram, TikTok, Facebook লিঙ্কের মাধ্যমে পণ্য এবং পোস্ট দিয়ে পূরণ করুন।
- আপনার পুরোনো সাইট থেকে কন্টেন্ট স্থানান্তর করুন—শুধু ঠিকানাটি উল্লেখ করুন।
- সেরা ইঞ্জিন React ( Next.js)-এ তৈরি আধুনিক ডিজাইন, সাথে রয়েছে সার্ভার রেন্ডারিং এবং এসইও অপটিমাইজেশন।
- সার্চ রেজাল্ট এবং নিউরাল নেটওয়ার্ক সুপারিশের জন্য সম্পূর্ণ স্বয়ংক্রিয় এসইও অপ্টিমাইজেশন।
একই রকম শৈলী
- 099 SUPPLY — সাদা-কালো বস্তুতে ভরা একটি গ্যালারির দেয়াল
- teenage engineering — স্টুডিও লাইটিং-এর ইন্ডাস্ট্রিয়াল ক্যাটালগ - পৃষ্ঠার একমাত্র গুরুত্বপূর্ণ বস্তু হলো পণ্যটি, এবং বাকি সবকিছু এটিকে কেন্দ্র করে আলোচনা করা হয়।
- Custo — গানমেটাল রঙের একটি গ্যালারি, যেখানে ব্যবহৃত হয়েছে একশিলা ফন্ট। অনুজ্জ্বল ধূসর-সবুজ আভার একটি শোরুম, যেখানে একটিমাত্র গাঢ় রঙের বস্তু এবং ৫৭ পিক্সেলের ফন্টই নিজের কথা বলে।
- Walden — অরণ্যের মেঝের নীরবতা — প্রতিটি পণ্যই একটি পাথর, প্রতিটি পিক্সেলই শ্যাওলা আর নীরবতা।
- Fiverr — ডিজিটাল বাজারটির কেন্দ্রবিন্দু হলো অন্ধকার থিয়েটার মঞ্চের পটভূমিতে একটি প্রাণবন্ত সবুজ স্পন্দন। একটিমাত্র নিয়ন সবুজ বিন্দু লোগোটির ভিত্তি হিসেবে কাজ করে; বাকি অংশটি একরঙা, যা প্রদত্ত পরিষেবাগুলোর আকর্ষণ তুলে ধরার জন্য ডিজাইন করা হয়েছে।
- Peloton — ঘোর কালো রানওয়ের ওপর একটি লাল বাতিঘর। একটি ফিটনেস শোরুম, যেখানে বিশাল, অন্ধকার প্রদর্শনী স্থান ভেদ করে একটিমাত্র উজ্জ্বল লাল ‘কল টু অ্যাকশন’ (CTA) চিহ্ন পরিষ্কার, সাদা রঙের পণ্যের ঘরগুলোর দিকে পথ করে দিয়েছে।
- HOUSEPLANT — লিনেন কাগজে বাদাম সহ একটি বইয়ের দোকান
- Adam Lippes — ক্রিম রঙের কাগজে ছাপা একটি সাদাকালো এডিটোরিয়াল স্টুডিও – ভোগ ম্যাগাজিনের এমন একটি স্প্রেড, যেখানে একমাত্র সজ্জা হলো লেআউট গ্রিড, রঙের বিন্যাস নয়।
- Elektron — মধ্যরাতে যন্ত্রপাতির কন্ট্রোল প্যানেলটি প্রায় একটি কালো ক্যানভাসের মতো, যেখানে পণ্যের ছবিগুলো উজ্জ্বল হয়ে ওঠে, অথচ ইন্টারফেসটি কার্যত অদৃশ্য থাকে।
- Sigmaphoto — প্রিসিশন ইনস্ট্রুমেন্টস-এর মনোক্রোম গ্যালারি হলো একটি শান্ত সাদা ঘর, যেখানে একমাত্র সেই রঙটিই গুরুত্বপূর্ণ যা আপনাকে কর্মে উদ্বুদ্ধ করে।
- Channel Studio — একটি প্রবাল ল্যাম্পশেড সহ একটি স্টুডিও ফটো ল্যাব
- Specht Studio — সূক্ষ্ম কৌতূহলে পরিপূর্ণ একটি গ্যালারি দেয়াল। স্টুডিওটির নিজস্ব ক্রোম ফিনিশটি হলো একটি সাদা পৃষ্ঠ এবং কালো অক্ষর; এর দৃশ্যগত চমক সম্পূর্ণরূপে প্রকল্পটির টাইলসের কাজের মধ্যেই কেন্দ্রীভূত।