
Apple
თეთრი ოთახი ერთი ლურჯი ჩამრთველით
Apple-ის დიზაინი თავშეკავების მოდელია: თითქმის თეთრი ტილო, უხვი თეთრი სივრცე და ერთი, ნათელი ლურჯი აქცენტი, რომელიც ყველა მოქმედებას განზრახულად აქცევს. მთავარი აქცენტი ტიპოგრაფიაზეა - SF Pro, ასოებს შორის უარყოფითი ინტერვალით, რომელიც ზომის ზრდასთან ერთად მცირდება, რაც სათაურებს არქიტექტურულ სიცხადეს სძენს ზედმეტად მძიმე არ არის. პროდუქტი დიზაინია: პროდუქტის დიდი ფოტოები და ცხოვრების წესის სურათები დომინირებს, ხოლო ქრომის ელემენტები თხელ ჩარჩოებში, გამჭვირვალე ნავიგაციასა და დახვეწილ ხაზებში იკარგება. სექციები მონაცვლეობით ერწყმის ღია ნაცრისფერ ფონზე სრულფეროვან ბლოკებს სარეკლამო მასალებისთვის, რაც ქმნის რიტმს მასშტაბის ცვლილებებით და არა დეკორატიული ელემენტებით.
გვერდის განლაგება სრული სიგანის გვერდია კონტეინერის ფიქსირებული მაქსიმალური სიგანის გარეშე — სექციები გადაჭიმულია კიდიდან კიდემდე, ტექსტური ბლოკებით, რომლებიც ცენტრშია დაახლოებით 980 პიქსელზე. ნავიგაცია არის ერთი, ფიქსირებული გლობალური ზოლი დამატებითი ქვესაქაღალდით თითოეული პროდუქტისთვის, რომელიც გადახვევისას ჩნდება. ძირითადი განლაგება ყოველთვის ცენტრირებულია: დიდი პროდუქტის სახელი, ერთსტრიქონიანი სლოგანი, ორი აბის ღილაკი და შემდეგ პროდუქტის სურათი, რომელიც ავსებს დარჩენილ ხედვის არეალს. სექციები ვერტიკალურად არის დაწყობილი დიდი ვერტიკალური რიტმით (64 პიქსელი+ სექციებს შორის), #f5f5f7 და ფერადი ფონის მონაცვლეობით. ქვედა გვერდი არის სრული სიგანის სერვისის ბარათების ერთი ჰორიზონტალური რიგი (Apple TV+, Fitness+, Music, Arcade), თითოეული ფოტო ბლოკია გადაფარვის ტექსტით და აბის ღილაკით. არ არის გვერდითი ზოლები, არ არის მრავალსვეტიანი კონტენტის განლაგება, არ არის ასიმეტრიული კომპოზიციები — ყველაფერი არის ცენტრირებული, დაწყობილი და სიმეტრიული.
ფოტოგრაფია დომინანტური ვიზუალური ენაა. პროდუქტის ფოტოები გადაღებულია სუფთა თეთრ ან ნაცრისფერ ფონზე, ყოველგვარი კონტექსტის გარეშე - მოწყობილობა არის ვარსკვლავი, იზოლირებული და განათებული. ცხოვრების სტილის ფოტოები ნაჩვენებია სრული სიგანის ბანერებში, ხშირად მჭიდროდ მოჭრილი ობიექტებით. ფერის გრადიენტები (პასტელური ლურჯი, ვარდისფერი, მწვანე) პროდუქტის სექციების ფონს წარმოადგენს და არა დეკორაციას. იკონოგრაფია მინიმალისტური და ხაზოვანია, 1-2 პიქსელი სისქით, ტექსტის იმავე ნაცრისფერ ტონშია. არ არის ილუსტრაციები, არ არის აბსტრაქტული გრაფიკა, არ არის 3D რენდერინგი, გარდა თავად პროდუქტის ფოტოებისა.
პალიტრა
ბრენდი
- Apple Blue
#0071e3— შევსებული მოქმედების ღილაკები, შერჩეული მდგომარეობები - ერთადერთი ინტერაქტიული ქრომატული ფერი, რომელიც იშვიათად გამოიყენება ყველა გამოჩენას აზრიანი რომ გახადოს. - Link Blue
#0066cc— მოქმედების ხაზგასმული საზღვრები, ჩაშენებული ბმულები - Apple Blue-ზე უფრო გაჯერებული ფერი გამოიყენება იქ, სადაც შევსებული პლანშეტი ზედმეტად თვალშისაცემი იქნებოდა. - Signal Blue
#2997ff— დეკორატიული ჩარჩოები, გამოსახულების კონტურები, ხატულების საზღვრები - სისტემაში ყველაზე ღია ლურჯი ფერი, რომელიც გამოიყენება ატმოსფეროსთვის და არა მომხმარებლის ურთიერთქმედებისთვის.
ნეიტრალური
- Carbon
#1d1d1f— ძირითადი ტექსტი, სათაურების საზღვრები, ნავიგაციის ხაზები, ბარათის საზღვრები - მელნის დომინანტური ფერი თითქმის შავია თბილი ელფერით. - Frost
#f5f5f7— გვერდის ტილო, მთავარი ტექსტის ფონი და ქვედა კოლონტიტულის ზედაპირი Apple-ის დამახასიათებელი ღია ნაცრისფერია, რომელიც ოდნავ უფრო გრილი ფერისაა, ვიდრე სუფთა თეთრს. - Ice
#f4f8fb— ექსპრესიული ზედაპირის შევსება, დახვეწილი ელფერები, ღილაკების ტექსტი მუქ ფონზე - დახვეწილი ლურჯი ელფერი, რომელიც აცოცხლებს განყოფილებას მისი გამორჩევის გარეშე. - Smoke
#333333— მეორადი ტექსტი, ნავიგაციის შევსება, ღილაკის საზღვრები - მრავალმხრივი ნეიტრალური ფერი საზღვრებისა და ხატულებისთვის, რომლებსაც საშუალო ნაცრისფერთან შედარებით მეტი გამოკვეთა სჭირდებათ. - Graphite
#474747— ნავიგაციის ტექსტი, ნავიგაციის საზღვრები, ბმულის საზღვრები - ელემენტების იერარქიაში ნახშირბადსა და კვამლს შორის შუალედურ პოზიციას იკავებს. - Ash
#707070— ქვედა კოლონტიტულის ტექსტი, სიის საზღვრები, ნავიგაციის საზღვრები, მდუმარე ძირითადი ტექსტი - საშუალო ნაცრისფერი ფერი იმ კონტენტისთვის, რომელიც უნდა იყოს წარმოდგენილი, მაგრამ არა თვალსაჩინო.
ტიპოგრაფია
12-დან 56 პიქსელამდე · 8 ნაბიჯი
- SF Pro Display — ჩანაცვლება: Inter · კონტურები 400, 600, 700 · სათაურები და დიდი ტექსტი — 40 პიქსელზე მეტი ზომისთვის გამოიყენება ეკრანის ფორმატი უფრო ვიწრო დიაფრაგმისა და უფრო ძლიერი ნეგატიური თვალთვალისთვის; 700 განკუთვნილია სარეკლამო განლაგებისთვის, ხოლო 400 - სარედაქციო კონტენტში პროდუქტის დასახელებებისთვის.
- SF Pro Text — ჩანაცვლება: Inter · კონტურები 300, 400, 600 · ძირითადი ტექსტი, ნავიგაცია, ღილაკები, ქვესათაურები — სამუშაო შრიფტი; 400 ძირითადი ტექსტისთვის, 300 ქვესათაურებისა და კვალიფიციური ეტიკეტებისთვის, 600 ნავიგაციის ელემენტებისა და ღილაკის ტექსტისთვის; უარყოფითი ასოების ინტერვალი მცირდება ზომის პროპორციულად (-0.022em-დან 12px-მდე, -0.01em-დან 44px-მდე).
ინტერვალები და ფორმა
| მიზანი | მნიშვნელობა |
|---|---|
| სიმჭიდროვე | საშუალო |
| ძირითადი ნაბიჯი | 12px |
| ღილაკის რადიუსი | 980px |
| ბარათის რადიუსი | 8px |
| ჩრდილები | საზღვრების გარეშე ჩრდილების ნაცვლად |
| სექციებს შორის | 64px |
| გვერდის სიგანე | 1440px |
ხელოვნური ინტელექტი შექმნის თქვენს ვებსაიტს Apple სტილში და შეავსებს მას
- შეავსეთ პროდუქტებითა და პოსტებით ბმულის საშუალებით - Instagram, TikTok, Facebook.
- გადაიტანეთ კონტენტი თქვენი ძველი საიტიდან — უბრალოდ მიუთითეთ მისამართი.
- თანამედროვე დიზაინი საუკეთესო ძრავზე: React ( Next.js) სერვერის რენდერინგით და SEO ოპტიმიზაციით, დაუყოვნებლივ.
- სრულად ავტომატიზირებული SEO ოპტიმიზაცია ძიების შედეგებისა და ნეირონული ქსელის რეკომენდაციებისთვის.
მსგავსი სტილები
- Studio — გალერეის კედელი მოძრაობაში. თითოეული ეკრანი წარმოადგენს მშვიდ, ნაცრისფერ საგამოფენო ზედაპირს, სადაც ტიპოგრაფიული მასალები და გადაფარებული შემოქმედებითი ნამუშევრები ყურადღების მოსაპოვებლად იბრძვიან.
- Mollie — ქაშმირის დახლი, მუქი ფერის წიგნი. შავი ტექსტის გარშემო დატოვეთ საკმარისი თეთრი სივრცე სარედაქციო დიზაინის შესაქმნელად, შემდეგ კი პროდუქტთან დაკავშირებული პუნქტები გააძლიერეთ თბილი კრემებით, ესპრესო-ყავისფერი ყავით და გადახდის რეალური მეთოდების ტაქტილური ფოტოებით.
- Basis Theory — დიზაინის სტუდიაში გადახდის ტერმინალები. ვიზუალურ მიმართულებას განსაზღვრავს თეთრი ტექნიკური ქაღალდი, გადაფარებული გამჭვირვალე ტრანზაქციის ფენები და ერთი ფირუზისფერი მართვის ელემენტი.
- CleanShot X — სტუდია ლურჯი განათებით. შექმენით მშვიდი თეთრი სივრცე კომპაქტური შავი ტექსტის გარშემო, შემდეგ კი მდიდარ ლურჯ მართვის საშუალებებსა და Mac პროდუქტის ფენებად დაყოფილ სურათებს მიეცით საშუალება, რომ ცენტრში იყვნენ.
- Modern Treasury — ხაზინის რეესტრი გრაფიკულ ქაღალდზე. შექმენით გვერდები, რომლებიც წყნარ, თეთრ საოპერაციო ფურცელს წააგავს, სადაც ფულადი ნაკადები ნაჩვენებია წვრილი ხაზებით, მონიშნული კვანძებით და ზუსტი, ფარული მართვის საშუალებებით.
- Basha-Franklin — თეთრი ლინტელის ქვეშ გალერეის ბადე. გამოიყენეთ თბილი #f4ede6 ელფერი, დახვეწილი შავი სტრუქტურა და ასიმეტრიული სვეტები, რომლებიც დაფუძნებულია ფოტოებზე დაბეჭდილი არქიტექტურული პორტფოლიოს მსგავსია.
- Bajgart Office — სარედაქციო გალერეის კედელი. გამოიყენეთ დიდი თეთრი სივრცე, სადაც დახვეწილი სერიფული შრიფტები და პორტფოლიოს ფრაგმენტები უფრო მეტ ვიზუალურ წონას იძენს, ვიდრე ქრომირებული ინტერფეისის ელემენტები.
- Heptabase — მზით განათებული მაგიდა. თბილი, ქაღალდის მსგავსი ზედაპირები, ნახშირისფერი მართვის საშუალებები და კვლევისთვის განკუთვნილი მცურავი ფანჯრები პროგრამული უზრუნველყოფის მართვის პანელის ნაცვლად ორგანიზებული სამუშაო სივრცის შეგრძნებას ქმნის.
- Bejamas — პიჟამოები - მჟავე ლაიმის ელფერი შავი მინის მიღმა. შექმენით მშვიდი, ღია ნაცრისფერი სარედაქციო გვერდები, რომლებიც შეწყვეტილია მომხიბვლელი შავი პანელებით, სადაც სინათლის ბუნდოვანი მწვანე ზოლები კვეთს ზედაპირს.
- Baba — მზრუნველობის ჩანაწერები წითელ მზის შუქზე. შექმენით ფართო წითელი თხრობითი ზოლები ინტიმური თეთრი, ვარდისფერი და კრემისფერი საინფორმაციო ზედაპირების გარშემო, ადამიანების ფოტოების ემოციურ ცენტრად გამოყენებით.
- Grafana Labs — მზის ამოსვლის სიგნალის სადგურის საკონტროლო ოთახი. მშვიდი, ნაცრისფერ-თეთრი სამუშაო სივრცე ერწყმის ფართო, ოთხფეროვან ჰორიზონტის გრადიენტს და ზუსტ ლურჯ ინტერფეისის სიგნალებს.
- Kagi — ცალკე სამკითხველო ოთახი. შექმენით ღია თეთრი სივრცე თამამი გრაფიტის ტექსტის გარშემო, დახვეწილი იისფერი აქცენტებისა და თბილი პასტელური ზედაპირების გამოყენებით სიმშვიდის დასარღვევად.