Shop
קבוצת כוכבים מסחרית צפה על שיש לבן
החנות המקוונת פועלת על מודל "בד לבן", כאשר המוצרים מוצגים ככרטיסי תמונה גדולים ומעוקלים בכבדות ולא כרשתות של תמונות ממוזערות. הממשק כולו חלק להפליא: רדיוסים של 20-28 פיקסלים לכל אורכו, פקדים בצורת גלולה, וגוף GT Standard קומפקטי של 16 פיקסלים עם מעקב שלילי הדוק שהופך את הטקסט לחד ומודגש. הדגשה המודגשת היחידה של המערכת היא סגול עז (#5433eb), המופיע בלוגו, בשדה תוצאות החיפוש המעגלי וכצל כהה על אותו כפתור. שאר פלטת הצבעים היא ניטרלית חמה: משטחים לבנים, בד אפור קריר ועדין, גבולות עדינים וטקסט כמעט שחור. הצפיפות נשארת קומפקטית עם מרזבים של 12 פיקסלים, אך פסי הגיבור והקטגוריה נושמים הודות לקצב אנכי נדיב של 64-80 פיקסלים, מה שגורם לחוויית המסחר להרגיש יותר כמו גלישה מאשר קטלוג.
הרוחב המרבי הוא 1200 פיקסלים, ממורכז על בד קנבס שקוף #f2f4f5, עם סרגל צד קבוע ברוחב 64 פיקסלים בצד שמאל המכיל רק סמלי ניווט. האלמנט הראשי הוא פס ברוחב מלא, עם כרטיסי מוצרים הממוקמים מעל לוגו סגול של "חנות" במרכז, וסרגל חיפוש בצורת גלולה ישירות מתחתיו. גלולות הקטגוריות מסודרות בשורה אחת במרכז מתחת לסרגל החיפוש. מדורי התוכן (נשים, גברים, יופי, בית, תינוקות וילדים) מופיעים כרצועות ייעודיות, כל אחת מכילה רשת בת 4 עמודות עם תמונות מוצרים או קומפוזיציה בת 2 עמודות של "אלמנט ראשי ורשת". הקצב האנכי נדיב: 64-80 פיקסלים בין מדורים ראשיים. הכותרת התחתונה היא פס כהה בתחתית העמוד עם קבוצות קישורים בצורת עמודות. חיצי קרוסלה בצד ימין של לוחות המוצרים האופקיים מציינים תוכן הניתן לגלילה ללא נקודות דפדוף.
צילום הוא האלמנט החזותי הדומיננטי: תמונות מוצר במסך מלא על רקע לבן, תמונות חתוכות ביחס של 1:1, ותמונות לייף סטייל עם גוונים אדמתיים חמים (בז', טרקוטה, מרווה, שנהב). לתמונות מוצרים יש צבע משלהן - ממשק המשתמש נשאר אכרומטי, מה שמאפשר לגווני המוצר לספק גיוון חזותי. לוגואי מותג מופיעים כטקסט חופף על תמונות ראשיות כהות או בהירות, ולא כסמלים בודדים. בקומפוזיציה הראשית, כרטיסי מוצר ממוקמים כקבוצת כוכבים צפה, חופפת מעט, מעל סימן המילה. הסמלים מינימליסטיים ומונוכרומטיים (קווי מתאר שחורים), למעט סמלי קטגוריות, המשתמשים בצבע מותג יחיד. אין איורים, אפקטים תלת-ממדיים או מעברים בתמונות המוצר.
לוּחַ הַצְבָעִים
מותג
- Shop Violet
#5433eb— כפתור השליחה, סימן הטקסט המקווקו ולוגו המותג הם האלמנטים היחידים שמדגישים את הפעולה והאינדיבידואליות על הרקע הלבן. - Violet Wash
#c0b5f3— הילה שקופה מאחורי כפתור השליחה הסגול ששומרת על זוהרה מבלי לשנות את גוון הצבע.
נֵטרָלִי
- Canvas Mist
#f2f4f5— רקע הדף וטיפול פני שטח נוסף מאחורי כרטיסים מורמים. - Pure White
#ffffff— המשטח העיקרי לכרטיסים, שדות קלט, שלטים צפים וכפתורים בצורת גלולה. - Ink Black
#000000— טקסט עיקרי, כותרות, סמלים, סמלי ניווט וכרטיסי מוצר במצב כהה. - Faint Border
#ebebeb— קווי הפרדה דקים על גבי כרטיסים, קווי מתאר של שדות קלט ומסגרות כפתורים בצורת גלולה. - Muted Gray
#787574— טקסט משני, תוויות ניווט, קווי מתאר של סמלים כאשר לא פעילים - Cool Stone
#cccccc— מצייני מיקום, מצבים מושבתים ורקעים של סמלים לא פעילים
טיפוגרפיה
מ-11 עד 16 פיקסלים · 4 שלבים
- GT Standard — תַחֲלִיף: Inter · קווי מתאר 400 · הגופן העיקרי בכל הגדלים - הן לגוף הטקסט והן לכותרות. GTStandard-MRegular בגודל 16px/-0.031em הוא הגופן העיקרי לגוף הטקסט, כפתורים ותוויות. GTStandard-MSemibold בגודל 20px/-0.05em משמש למספר כותרות גדולות; GTStandard-MMedium בגודל 11–12px משמש לכיתובים קטנים. כל וריאנט גופן מוצג עם משקל אופטי של 400 - היררכיית גופנים מושגת באמצעות מעברי צבע עדינים וריווח אותיות שלילי צפוף, ולא ניגודיות מודגשת. זהו סגנון חתימה: Shop לא צועקת עם גופנים מודגשים, אלא מעצבת את הטקסט באמצעות ריווח אותיות.
- Shopify Sans — תַחֲלִיף: Inter · קווי מתאר 400, 700 · שמור להודעות ברמת המערכת כגון באנרים לטעינת אפליקציות וטקסט הסכמה לקובצי Cookie.
אינטרוולים וצורה
| מַטָרָה | מַשְׁמָעוּת |
|---|---|
| צְפִיפוּת | מְמוּצָע |
| שלב בסיסי | 12px |
| רדיוס הכפתור | 9999px |
| רדיוס הכרטיס | 28px |
| צללים | צללים רכים |
| בין סעיפים | 64px |
| רוחב העמוד | 1200px |
בינה מלאכותית תבנה את אתר האינטרנט שלך בסגנון Shop ותמלא אותו
- מלאו מוצרים ופוסטים דרך הקישור - Instagram, TikTok, Facebook.
- העברת תוכן מהאתר הישן שלך - רק ציין את הכתובת.
- עיצוב מודרני על מנוע הפיתוח הטוב ביותר: React ( Next.js) עם רינדור שרת ואופטימיזציה של קידום אתרים (SEO) ישירות מהקופסה.
- אופטימיזציה אוטומטית לחלוטין של SEO עבור תוצאות חיפוש והמלצות לרשתות עצביות.
סגנונות דומים
- Apple iPhone Duo — מכשיר מתקפל בגלריה לבנה. הדמיות חזותיות של המוצר נמצאות במרכז, בעוד שהטיפוגרפיה והבקרות הכחולות מעומעמות במכוון.
- AYOCIN — טוטם סולארי של בריאות. צרו מסכים המזכירים תצלום פנים חם: גופן מונומנטל, צללים אדריכליים מטושטשים עדינים, ואובייקט יחיד מואר בחלל רגוע וקרמי.
- Apple AirPods 5 — אפל - קולנוע על רקע לבן. מרחב לבן עצום לעריכה מפנה את מקומו לפרסומות באורך מלא, שבהן צלליות של עצמים נעים ותאורה רוויה יוצרות דרמה חזותית.
- Hopper — חלון מעל סנטוריני עם רדת החשיכה. תצלום מרוכך של היעד משמש כשכבת כיסוי אטמוספרי, ועליו פקדי ניווט והזמנה לבנים קומפקטיים.
- Bose — במת קול על החוף. תמונת פרסום מנשבת ברוח ממלאת את הפריים, בעוד שפקדי קמפיין חדים בשחור-לבן מסודרים סביבה כמו פרטים מדויקים.
- Bauhaus Clock — שעונים בהשראת באוהאוס – הארה מכנית בצבע טורקיז. מסגרו משטחים רגועים ובהירים עם תמונת שעון כהה וקולנועית והשתמשו בטורקיז כפרט זוהר נדיר.
- Cursor — סדנת קלף נעימה, מוארת בגחלים בוערות
- Slush — יקום מתנפח של מדבקות על נייר פסטל
- MindMarket — ספר אגדות נעים על נייר בצבע קרם - בד עריכה ידידותי שבו כותרות גדולות של אינטר ודמויות נייר גזורות מתקיימות יחד על משטח שטוף שמש ורך כמדבקה.
- Airbnb — קיר גלריה לבן ושקט עם סימניה אדומה אלמוגית אחת
- Superr — מחברת בית ספר חמה באור אחר הצהריים הרך. דף בצבע קרם, טוש כתום ללא מכסה, וערימת מדבקות שם למינציה שמחכות להתקלף.
- Apple (España) — גלריית המוזיאון, באור יום רך, היא חלל לבן יחיד, שובה לב וחסר משקל, כאשר כל תערוכה מוארת בזרקור על קיר כהה קלות.