ბრტყელი დიზაინი: რატომ გახდა დიზაინი ბრტყელი? ბრტყელი დიზაინი: წარსული, აწმყო და მომავალი სტილის დადებითი და უარყოფითი მხარეები.

შედარებით ცოტა ხნის წინ, პოპულარული გახდა ისეთი დიზაინის მიმართულება, როგორიცაა FLAT დიზაინი ან ბრტყელი დიზაინი.

Windows 8 და უფრო გვიანდელი ვერსიების მომხმარებლები უკვე იცნობენ FLAT დიზაინს, რადგან პირველი, რაც მათ აწყდებიან სისტემის ჩატვირთვისას, ეს ეკრანია.

FLAT დიზაინის გარეგნობა გამოწვეულია მობილური აპლიკაციების გავრცელებით. და მე ვფიქრობ, რომ ეს გამოწვეულია იმით, რომ FLAT დიზაინის ობიექტები იქმნება ვექტორული ობიექტების გამოყენებით და, შესაბამისად, ისინი უფრო ადვილად ადაპტირდებიან სხვადასხვა გაჯეტების პლატფორმებთან.

FLAT - დიზაინს აქვს შემდეგი მახასიათებლები:

გრადიენტების, რთული ტექსტურებისა და ჩრდილების სრული ან ნაწილობრივი უარყოფა , რაც მე პირადად ძალიან მიხარია. მე არ მაქვს პრეტენზია ჩრდილებთან დაკავშირებით და მიყვარს მათი გამოყენება, მაგრამ გრადიენტური ჩვენების მარადიული პრობლემები გაქრება.

წინა პლანზე გამოდის ტიპოგრაფია, გეომეტრია. განსაკუთრებით მაშინ, როდესაც საქმე ეხება ვებ დიზაინს.

ჰარმონია და. დიზაინში გამოყენებულია ფერების შეზღუდული რაოდენობა. აქ არის პოპულარული FLAT დიზაინის პალიტრის მაგალითი.

შემოქმედებითი ინფორმაციული ხატების გამოყენება.

როგორც უკვე ვთქვი, FLAT დიზაინი ძალიან პოპულარული გახდა მობილურ აპლიკაციებში, რადგან მისი მთავარი მახასიათებელია განლაგების სიმარტივე და ადაპტირება. FLAT დიზაინი ასევე ფართოდ გავრცელდა ინფოგრაფიკაში, რადგან ის ეფუძნება ინფორმაციის ჰარმონიულ აღქმას ტიპოგრაფიისა და ფერის კონსტრუქციული ტექნიკის გამოყენებით.

ერთ დროს ვებ დიზაინის ყველაზე პოპულარული ტენდენცია იყო ვებ 2.0. ახლა მისი ადგილი FLAT დიზაინმა დაიკავა. მოდას ჩვევა აქვს მივიწყებულ ძველს დაუბრუნდეს, რათა მისგან რაიმე ახალი შექმნას. ვინ იცის, როდის გადავა FLAT დიზაინი მოდიდან, მაგრამ ახლა ისიამოვნეთ მიმდინარე ტრენდის სიმარტივით, ჰარმონიით და ინფორმაციული შინაარსით. სხვათა შორის, ბრტყელი დიზაინი უკვე პოპულარული იყო 80-იან წლებში, მაგრამ მაშინ ეს იყო ტექნიკური მახასიათებლებისა და ჩრდილების და გრადიენტების ჩვენების შეუძლებლობის გამო. ახლა კი წამყვანი IT კომპანიების უმეტესობა გადავიდა Flat დიზაინზე.

კარგად, ჩვენც მოვერგებით ცვალებად სამყაროს. შემდეგ სტატიაში მე გაჩვენებთ, თუ როგორ შეგიძლიათ შექმნათ FLAT სტილის ხატები Photoshop-ში მარტივი ფორმების გამოყენებით.

თუ ჩემი პუბლიკაციები დაგაინტერესებთ, მაშინ გირჩევთ, გაეცანით საიტზე არსებულ უახლეს განახლებებს.

(ეწვია 2,333-ჯერ, 1 ვიზიტი დღეს)

ვინც ავითარებს მობილურ აპლიკაციებსა და ვებგვერდებს, დაგვიწერა სვეტი და ყველაფერი თავის ადგილზე დადო ბინის და მატერიალურ დიზაინთან დაკავშირებით.

ზოგადად, განსხვავება ბრტყელ დიზაინსა და მასალის დიზაინს შორის დახვეწილია. ადამიანს, რომელსაც არ აქვს ღრმა ცოდნა გრაფიკული დიზაინის შესახებ, ისინი შეიძლება მართლაც ძალიან ჰგვანან. ამ სტატიაში შევეცდები „ნათელი მოჰფინოს“ მათ შორის არსებულ ზოგიერთ განსხვავებას. თქვენ მიიღებთ დამატებით ცოდნას, რომელიც იმდენად აუცილებელია, რომ შემთხვევით არ დააზიანოთ დიზაინერის ნატიფი ბუნება.

ცოტა ისტორია

სანამ დავიწყებთ საუბარს ორი ყველაზე პოპულარული დიზაინის ტენდენციას შორის განსხვავებების შესახებ, მოდით გავარკვიოთ, საიდან მოდის ისინი. არსებობს მოსაზრება, რომ მასალის დიზაინი იქმნება ბინის საფუძველზე. მაშინ საიდან გაჩნდა ბრტყელი დიზაინი?

სკევომორფიზმი

როდესაც საქმე ეხება მომხმარებლის ინტერფეისს და ვებ დიზაინს, სკეუმორფიზმის კონცეფცია ეხება მიდგომას, რომლის მთავარი იდეაა იმიტაცია. ზედმეტი დეტალების გარეშე, უბრალოდ გავიხსენოთ Apple-ის წინასწარი iOS 7 ინტერფეისები მათი „რეალისტური ტექსტურებით, განათებითა და ბომბასტური ეფექტებით“.

ციფრული ობიექტების რეალურ კოლეგებთან მიმსგავსების მცდელობა მოტივირებული იყო მოწყობილობასთან მომხმარებლის ურთიერთქმედების ხელშეწყობის აუცილებლობით. სინამდვილეში, ეს არის მიზეზი იმისა, რომ რეალისტური ტექსტურების მქონე ყველა ინტერფეისი მრავალი წლის განმავლობაში დომინირებს ციფრულ სამყაროში. Skeuomorphic დიზაინი შესანიშნავად ეხმარება მომხმარებლებს რეალურ სამყაროდან ციფრულ სამყაროზე შეუფერხებლად გადასვლაში.

თუმცა, მობილური ტექნოლოგიის ზრდასთან ერთად, თანდათან ჩნდება მოთხოვნილება, რომ ფოკუსირება მოახდინოთ პირველ რიგში მოხერხებულობაზე და გამოყენების მარტივობაზე. დამეთანხმებით, ამ სფეროში მნიშვნელოვნად იზრდება სხვადასხვა მოწყობილობიდან ხელმისაწვდომი მობილური გადაწყვეტილებების შექმნის საჭიროება. და სწორედ ამ მომენტში, სიმარტივე ხდება ახალი დიზაინის სტანდარტი.

შენიშვნა: არავითარ შემთხვევაში არ იფიქროთ, რომ სკეომორფიზმი მთლიანად გაქრა. იგი ფართოდ გამოიყენება თამაშებში, სადაც აუცილებელია რეალისტური სამყაროს შექმნა და მოთამაშეების დახმარება, იგრძნონ თავიანთი ხასიათი, რათა ღრმად ჩაეფლონ თამაშის პროცესში.

ბრტყელი დიზაინი

ეს სტილი სრულიად მოკლებულია სამგანზომილებიან ობიექტებს. უხეშად რომ ვთქვათ, ბრტყელ დიზაინს აკლია ისეთი სტილისტური ელემენტები, როგორიცაა ჩრდილები, ტექსტურები, გრადიენტები, მაგრამ ყურადღებას აქცევს შრიფტების, ფერების და ხატების თამაშს. მაგრამ რატომ იყო ეს ყველაფერი საჭირო? პასუხი მარტივია.

პირველ რიგში, ბრტყელი დიზაინი მნიშვნელოვნად ამცირებს გვერდის ჩატვირთვის დროს. „მძიმე“ სკევომორფული დეტალების არარსებობა (ვფიქრობ: ფენები, სერიფული შრიფტები, გრადიენტები) ბრტყელი დიზაინის ელემენტებს „მსუბუქს“ ხდის, რაც თავის მხრივ მნიშვნელოვნად აჩქარებს დატვირთვის დროს. უფრო მეტიც, ბრტყელი ელემენტები ერთნაირად მიმზიდველად გამოიყურება როგორც მაღალი, ასევე დაბალი გარჩევადობის ეკრანებზე.

მეორეც, მარტივ სურათებს შეუძლიათ თქვენი აზრი უფრო სწრაფად მიაწოდონ მომხმარებლებს, ვიდრე დეტალურ ილუსტრაციებს: ისინი ესკიზურია და, შესაბამისად, საკმაოდ ადვილად გასაგები.

და, რა თქმა უნდა, ბრტყელ ხატებს შედარებით მარტივი შრიფტით შეუძლია მომხმარებელთა ყურადღება მიმართოს მართლაც მნიშვნელოვან შინაარსზე.

დღეს ბინის დიზაინმა დამსახურებული აღიარება მიიღო, მაგრამ მას მაინც აქვს თავისი პრობლემები. ასეთი პრობლემების ყველაზე თვალსაჩინო მაგალითი იყო Microsoft-ის მიერ Windows 8-ის გამოშვება. ეს ოპერაციული სისტემა ითვლება ბრტყელი დიზაინის პიონერად და მხარს უჭერს მეტრო დიზაინის კონცეფციას. პრობლემების მიზეზი ის იყო, რომ კომპანიამ საჭიროდ ჩათვალა უფრო მეტი ყურადღება მიაქციოს ტიპოგრაფიას, ვიდრე თავად გრაფიკას.

NN Group-ის მიერ ჩატარებული Windows 8-ის გამოყენებადობის ტესტის შედეგებმა აჩვენა, რომ მომხმარებლებს უჭირთ დაწკაპუნებადი ობიექტების გარჩევა დაწკაპუნებადი ობიექტებისგან. მომხმარებლები ჩიოდნენ, რომ ობიექტები, რომლებიც სტატიკური ჩანდა, რეალურად იყო დაწკაპუნებული. შედეგად, კომპანიის მთავარი მისია - დაეხმაროს მომხმარებლებს სისტემის სწორად ინტერპრეტაციაში - ჩაიშალა.

კიდევ ერთი კომპანია, რომელიც ხშირად ასოცირდება ბრტყელ დიზაინთან, არის Apple. ისინი ჩამოშორდნენ სკეუმორფული დიზაინის ელემენტებს მობილური ოპერაციული სისტემა iOS 7-ში, რომელიც გამოვიდა 2013 წელს. ამჯერად გადასვლა ოდნავ უკეთესად მიიღეს, ძირითადად იმის გამო, რომ კომპანიამ არ სცადა მომხმარებლის ინტერფეისის კონცეფციის სრულად განახლება, არამედ უბრალოდ დაამატა რამდენიმე ცვლილება ბრტყელი დიზაინისკენ. ეს საშუალებას აძლევს მომხმარებლებს გამოიყენონ პროდუქტი ოპერაციული სისტემებისა და ვებსაიტების წინა გამოცდილებაზე დაყრდნობით.

მასალის დიზაინი

მოდით, ახლავე ვიყოთ ნათელი: მატერიალური დიზაინი უფრო ბრენდირებული პროდუქტია, ვიდრე სპონტანური დიზაინის ტენდენცია, რომელმაც ფართო აღიარება მოიპოვა. ეს არის ის, რაც ძირითადად განასხვავებს მას ბრტყელი დიზაინისგან.

დიზაინის მასალას „ბრენდირებული“ წოდებით ვგულისხმობ, რომ მას აქვს მკაფიოდ განსაზღვრული რეკომენდაციები და პრინციპები, რომლებსაც ყველა თავმოყვარე დიზაინერი მისდევს. სავსებით აშკარაა, რატომ შემოიტანა Google-მა თავისი Material Design: საჭირო იყო დიზაინის გაერთიანება ისე, რომ აპლიკაციები ერთნაირად გამოიყურებოდა Android-ის ნებისმიერ მოწყობილობაზე.

მიუხედავად იმისა, რომ საკმაოდ ფუნქციონალურია, ბრტყელი დიზაინი მაინც ძნელად გასაგებია. სიმართლე ისაა, რომ ეკრანზე ბრტყელ ობიექტებს შეუძლიათ დააბნიონ მომხმარებლები (განსაკუთრებით მათ, ვისაც არ აქვს გამოცდილება მობილური და ვებ ინტერფეისების გამოყენებაში). ამიტომ, მატერიალური დიზაინი ცდილობს დააბრუნოს სკეუმორფიზმის ელემენტები, მაგრამ ძალიან გამარტივებული ფორმით. სურათები გამოიყურება ბრტყელი, განსაკუთრებით მაშინ, როდესაც საქმე ფერებს ეხება, მაგრამ მაინც მრავალგანზომილებიანია Z-ღერძის არსებობის წყალობით.

სხვა სიტყვებით რომ ვთქვათ, მატერიალურ დიზაინს შეიძლება ეწოდოს ბრტყელი დიზაინის გაუმჯობესებული ვერსია სკეუმორფიზმის ელემენტებით - ანიმაცია, ჩრდილები და ფენები. ამ გზით შეგიძლიათ პროდუქტი უფრო ინტუიციური გახადოთ ნავიგაციის თვალსაზრისით და თავიდან აიცილოთ ზედმეტი სირთულე საერთო სტილის ფარგლებში.

ბრტყელი დიზაინის დადებითი და უარყოფითი მხარეები

მოდით, უკან დავტოვოთ სტილის ევოლუციის ისტორია და გადავიდეთ უფრო მნიშვნელოვანზე - ჩამოვთვლით ბრტყელი დიზაინის ძლიერ და სუსტ მხარეებს.

• მინიმალიზმი და სტილი
• ინტუიცია. გაგიადვილდებათ თქვენი იდეის მომხმარებლებისთვის გადაცემა.
• დროისა და რესურსების დაზოგვა. გვერდები იტვირთება ბევრად უფრო სწრაფად, ნაკლები გამტარუნარიანობის მოხმარებით.
• ფოკუსირება შინაარსზე. ინტერფეისი თავისუფალია არასაჭირო დეტალებისგან, რამაც შეიძლება ყურადღება გადაიტანოს მართლაც ღირებული ინფორმაციისგან.
• ერთნაირად კარგად გამოიყურება სხვადასხვა მოწყობილობებზე, იქნება ეს კომპიუტერის ბრაუზერი თუ სმარტფონი.
• აჩქარებს ვებსაიტის ან აპლიკაციის დიზაინის შემუშავების პროცესს დიზაინის არასაჭირო შეხების აღმოფხვრის გზით.

• მინიმალისტური სტილი.
• საკმაოდ ინტუიციური ინტუიციურ დონეზე. მატერიალური დიზაინი ერთნაირად ადვილი იქნება როგორც გამოცდილი მომხმარებლებისთვის, ასევე დამწყებთათვის.
• ზომიერი სკეომორფიზმი. ყველაფერი უფრო რეალისტურად გამოიყურება Z-ღერძის გამოყენების წყალობით (გუგლის უნიკალური კონცეფცია).
• არსებობს სახელმძღვანელოების ნაკრები, რომელიც მუდმივად განახლდება. ამიტომ, ნებისმიერ დიზაინერს ყოველთვის შეუძლია მიმართოს მათ, თუ სირთულეები წარმოიქმნება სამუშაო პროცესში.
• წახალისებულია ანიმაცია ვებ გადაწყვეტილებისთვის. არ არის საჭირო შეგახსენოთ, თუ რამდენად უყვარს ხალხს მოძრაობა. გარდა ამისა, ანიმაცია საშუალებას გაძლევთ გახადოთ ინტერფეისი უფრო ნათელი და ინტუიციური.

• ჰყავს მფლობელი (გუგლის კომპანია). ამიტომ, გაუმჯობესების შესახებ ნებისმიერი შეკითხვა და წინადადება უნდა მიემართოს მფლობელს.
• Z ღერძის გამო, დიზაინის პროცესს შეიძლება მეტი დრო დასჭირდეს.
• ანიმაციური ელემენტები მეტ რესურსს მოითხოვს.
• მითითებების მკაცრი დაცვამ შეიძლება შეზღუდოს დიზაინის ორიგინალობა.

მოდით შევაჯამოთ

სინამდვილეში, ერთ-ერთი განსახილველი დიზაინის მიდგომა არ უნდა ჩაითვალოს აშკარა უპირატესობად მეორესთან შედარებით, რადგან ბრტყელი და მატერიალური სტილი ერთმანეთის გვერდიგვერდ მიდის. ისინი ორივე წარმოუდგენლად პოპულარულია და ორივე მოკლებულია ზედმეტ რეალიზმს. მასალის დიზაინი ბრტყელი დიზაინის მემკვიდრეა, ხოლო თავად ბრტყელი დიზაინი იყო რეაქცია გადაწყვეტილებებზე, რომლებიც ძალიან მძიმე და რეალისტური იყო. მასალის დიზაინმა დაამატა ის, რისგანაც ბრტყელი დიზაინი ყოველთვის ცდილობდა თავის დაღწევას - პატარა სკეუმორფიზმი. მიუხედავად იმისა, რომ ერთი რამ ყოველთვის განსხვავდება ამ მიდგომებს შორის: მატერიალური დიზაინი არის Google-ის საკუთრების პროდუქტი, ხოლო ბრტყელი დიზაინი არის რამდენიმე დიზაინის პრაქტიკის შერწყმის შედეგი, რომელიც ძირითადად საერთო სიმარტივისაკენ ისწრაფვის.

სინამდვილეში, ბრტყელი დიზაინი ბოლო წლებში ძალიან განვითარდა, სრულიად „ბრტყელი“ სტილიდან „ნახევრად ბრტყელ“ სტილამდე. ახლა ის იძლევა შრეებისა და დახვეწილი ჩრდილების გამოყენების საშუალებას, რათა ობიექტები უფრო ღრმად გამოჩნდნენ, ვიდრე ადრე ჩანდნენ. ასე რომ, მე და შენ ვართ ბრტყელი დიზაინის 2.0 ბედნიერი თანამედროვეები.

და ბოლოს, არაფერი გიშლით ხელს ამ ორი მიდგომის გაერთიანებაში, რათა შექმნათ ნამდვილად ფუნქციონალური და მოსახერხებელი პროდუქტი. ასე რომ, მიიღეთ შთაგონება ბრტყელი და მატერიალური დიზაინის გურუებისგან და შეუდგეთ მუშაობას!

თუ შეცდომას აღმოაჩენთ, მონიშნეთ და დააჭირეთ Ctrl + Enter! ჩვენთან დასაკავშირებლად შეგიძლიათ გამოიყენოთ.

ბინა - დიზაინი (ბრტყელი დიზაინი) პოპულარული სტილია ვებსაიტების და ინტერფეისების, ასევე ოპერაციული სისტემების დიზაინში, რომლის დამახასიათებელი ნიშნებია სიმარტივე, დახვეწილობა და მინიმალიზმი. ბინის დიზაინმა პოპულარობა მოიპოვა 2010 წელს, როგორც სკეუმორფიზმის საპირისპირო.

სკევომორფიზმი- ფიზიკური ორნამენტი ან დიზაინის ელემენტი, რომელიც კოპირებულია სხვა ობიექტის ფორმიდან, მაგრამ დამზადებულია სხვადასხვა მასალისგან ან სხვადასხვა მეთოდის გამოყენებით. მაგალითები მოიცავს ჭურჭელს, რომელიც მორთულია იმიტაციური მოქლონებით, რათა დაემსგავსოს ლითონისგან დამზადებულ მსგავს ქოთნებს, ან კომპიუტერული კალენდარი, რომელიც ასახავს ქაღალდის მაგიდის კალენდრის დამაგრებული გვერდების იერს (განმარტება ვიკიპედია).

დიზაინში ბრტყელი სტილის პოპულარიზაციას ხელი შეუწყო Microsoft-ისგან Windows 8 ოპერაციული სისტემის გამოშვებამ Metro სტილში, ასევე iOS 7, რომელშიც Apple ასევე ირჩევს ბრტყელ სტილს. სწორედ ამის შემდეგ იწყება ბრტყელი დიზაინის რეალური ერა. მალე დიდი საძიებო სერვისები და აპლიკაციები - Google, Youtube - გადადიან Flat-design-ზე, ჩნდება მრავალი საიტი, რომლებიც იყენებენ flat style პრინციპებს თავიანთ დიზაინში. ბოლო წლების განმავლობაში, ბრტყელი დიზაინი ლიდერია ვებსაიტების დიზაინის გლობალურ ტენდენციებში.

ბრტყელი დიზაინის უპირატესობები

1. პრაქტიკულობა- ბრტყელი დიზაინის გამოყენება საშუალებას გაძლევთ მინიმუმამდე დაიყვანოთ სტილის, სკრიპტებისა და ანიმაციების რაოდენობა, რაც საშუალებას აძლევს საიტს უფრო სწრაფად ჩაიტვირთოს.
2. ადვილად ადაპტირება- ბრტყელი დიზაინი საკმარისად მარტივია, რათა მოერგოს ეკრანის სხვადასხვა რეზოლუციას.
3. გამოყენების სიმარტივე- გამარტივებული სტილის წყალობით მომხმარებლებისთვის უფრო ადვილია საიტზე არსებული ინფორმაციის აღქმა.
4. სილამაზე- გარე მიუკერძოებლობა და მარტივი დიზაინი საშუალებას გაძლევთ ფოკუსირება მოახდინოთ დიზაინზე, რომელიც ნამდვილად იპყრობს თქვენს ყურადღებას.

ბრტყელი საიტის დიზაინის 5 პრინციპი

ბრტყელი დიზაინი სულაც არ არის მოსაწყენი, როგორც ეს ერთი შეხედვით შეიძლება ჩანდეს. მათი სიწმინდისა და დახვეწილობის წყალობით, დიზაინის გადაწყვეტილებები შეიძლება იყოს ელეგანტური და ლამაზი, ზედმეტი ხმაურის გარეშე, რაც საშუალებას მოგცემთ კონცენტრირდეთ თქვენს პროდუქტზე ან მომსახურებაზე.

1 - 2D ობიექტების გამოყენება

ბრტყელი დიზაინი გამორიცხავს ელემენტების გამოყენებას, რომლებიც ანიჭებენ ობიექტს სიღრმესა და მოცულობას: ჩრდილები, გრადიენტები, ხაზგასმა, ტექსტურები, ანარეკლები, ანიმაცია. როდესაც ობიექტის გამოსახულება ხდება, ნაჩვენებია მხოლოდ მისი კონტურები.

2 - ხატები და მარტივი ობიექტები

ბრტყელი ხატების და მონოსილაბური ფორმების გამოყენება მკაფიო კონტურებითა და იმავე ფერით საშუალებას გაძლევთ მაქსიმალურად გაამარტივოთ დიზაინი და გახადოთ იგი უფრო მსუბუქი. კონტროლი ხდება მომხმარებლისთვის ინტუიციური და ხელს უწყობს ურთიერთქმედებას.

3 - მარტივი შრიფტები დიზაინის სტილში

დიდი ყურადღება ეთმობა ტიპოგრაფიას და შრიფტებს ბრტყელ დიზაინში. აქ არ არის გამოყენებული დახრილი შრიფტი, რომელიც ჰარმონიულად ჯდება ვებსაიტის დიზაინში, არა მხოლოდ შინაარსობრივად, არამედ ნავიგაციაშიც. საიტის შრიფტის ტიპებშიც კი წახალისებულია მინიმალისტური სტილი.

4 - ფერების თამაში

ბრტყელი დიზაინი შეიცავს რამდენიმე ძირითად ფერს, რომელიც გამორიცხავს გლუვი გადასვლებისა და გრადიენტების გამოყენებას, მაგრამ შეიძლება იყოს ნათელი და კონტრასტული ერთმანეთთან.

5 - მინიმალიზმი

ბრტყელი დიზაინი გულისხმობს ელემენტების ვიზუალიზაციის გამოყენებას, ეკრანის მთელი სიგანის გამოყენებას და ამავდროულად ინფორმაციის მინიმიზაციას.

არსებობს ისეთი რამ, როგორიცაა თითქმის ბრტყელი დიზაინი. ეს არის ბრტყელი დიზაინის ერთ-ერთი კონცეფცია, რომელიც დაფუძნებულია მარტივი ელემენტებისა და ორგანზომილებიანი სივრცის გამოყენებაზე. ამის მაგალითი იქნება მაღალი ხარისხის ფოტო, რომელიც ბუნდოვდება ან ჩაბნელდება. ეს საშუალებას გაძლევთ შექმნათ ობიექტის სიღრმე და პერსპექტივა.

ბინის დიზაინის მაგალითები

ინტერნეტში, მათ შორის ბელორუსის სეგმენტში, შეგიძლიათ იპოვოთ მრავალი მაგალითი ბრტყელი დიზაინის მქონე ვებსაიტების განვითარების შესახებ სხვადასხვა თემებში, მათ შორის ახალი ამბების რესურსებს, პორტალებს და ონლაინ მაღაზიებსაც კი.

ავტორისგან:მოგესალმებით, მეგობრებო! დღეს ვისაუბრებთ იმაზე, თუ რა არის ბრტყელი დიზაინი, ანუ ბრტყელი ვებ-გვერდის დიზაინი. ამ ტერმინმა დიდი ხანია მოიგო ვებ დიზაინერების გული და დღესაც თავდაჯერებული ტენდენციაა. უმსხვილესი კომპანიები (Google, YouTube, Microsoft, Apple Inc. და ა.შ.) იყენებენ მას თავიანთი ვებსაიტების და აპლიკაციების შესაქმნელად. ჯერ კიდევ არ ხართ ბრტყელი ვებ დიზაინის მხარდამჭერების სექტაში? მაშინ ჩვენ მოვდივართ თქვენთან!

როგორ ფიქრობთ, რა არის ბრტყელი დიზაინის ასეთი ველური პოპულარობის მიზეზი? მოკლედ გიპასუხებ: ნამდვილად მუშაობს! ამ სტატიაში მე აგიხსნით, რა არის ეს სტილი, მოგიყვებით მის დადებით და უარყოფით მხარეებზე და გაჩვენებთ ბრტყელი ვებსაიტის დიზაინის რამდენიმე შესანიშნავ მაგალითს, რომელიც აუცილებლად შთაგაგონებთ შესანიშნავი საქმეების გაკეთებაში. მაშ, წავიდეთ!

ეს ყველაფერი სკეომორფიზმით დაიწყო

მათთვის, ვინც არ იცის, სკეუმორფიზმი არ არის ბინძური სიტყვა, არამედ ვებ დიზაინის სხვა სტილი. ბრტყელი დიზაინი ხშირად წარმოდგენილია სკეუმორფიზმის საპირისპიროდ, რაც, ჩემი აზრით, მთლად სწორი არ არის. ეს უფრო გამარტივებაა, ვიდრე ანტაგონიზმი.

2010 წლამდე ინტერფეისის დიზაინში დომინანტური სტილი იყო სკეუმორფიზმი. მან აჩვენა ელემენტები ისე, როგორც ისინი რეალურად ჩანდნენ, აქტიურად იყენებდა ტექსტურებს, ჩრდილებს, ანარეკლებს და სამგანზომილებიანი გამოსახულების სხვა ატრიბუტებს. Apple-მა განსაკუთრებული ძალისხმევა გამოიჩინა ამ მხრივ, საგულდაგულოდ დააკოპირა პროგრამული უზრუნველყოფის ობიექტების უმეტესობა რეალური ობიექტებიდან.

მალე, ფსევდო ამოზნექილმა ხატებმა შეწყვიტეს მომხმარებელთა და ვებ დეველოპერების უმრავლესობის მოზიდვა, რამაც აღნიშნა ბრტყელი ვებსაიტების დიზაინის ეპოქის დასაწყისი. მსოფლიო მივიდა დასკვნამდე, რომ ყველა დეკორატიული ელემენტი უნდა მოიხსნას და უნდა დარჩეს მხოლოდ ის, რაც მოსახერხებელია საბოლოო მომხმარებლისთვის.

"საუკეთესო დიზაინი არის რაც შეიძლება ნაკლები დიზაინი"

როგორ იყურებოდა დიტერ რამსი წყალში - ცნობილი ინდუსტრიული დიზაინერი, რომელიც ეწინააღმდეგება ინტრუზიულ დიზაინს, ანიმაციურ ეფექტებს და ა.შ.. 2013 წლის ივნისში Apple Inc. წარმოადგინა რევოლუციური iOS 7, რომელმაც მიიღო ბრტყელი ვებ დიზაინის სტილის ყველა ატრიბუტი. თუმცა, თვითმფრინავმა მაშინვე არ დაამარცხა რეალიზმი და მოცულობა.

დიდი ხნის განმავლობაში მომხმარებლები ვერ ივიწყებდნენ სტივ ჯობსის ჯადოსნურობას და ხატებს, „რომლებიც გინდათ ლპობა“. ბევრი დაემშვიდობა კიდეც "ღარიბ შვიდეულს" და გადაერთო "გასხივოსნებულ ანდროიდზე". ცეცხლზე ნავთის დამატება იყო iOS 7-ში არსებული შეცდომების დიდი რაოდენობა და აპლიკაციების გახსნისას მოთეთრო, გამჭვირვალე დიზაინი პარალაქსით და „სნოტ“ ანიმაციით.

ისინი, ვინც დამორჩილდნენ გარდაუვალ რეალობას და დარჩნენ Apple-ის ოპერაციულ სისტემაში, საბოლოოდ მიხვდნენ, რომ ბრტყელი ვებ-დიზაინი არა მხოლოდ გამოიყურება საინტერესო, არამედ მოაქვს წესრიგი და ერთიანი ვიზუალური სტილი ყველა აპლიკაციაში.

ბრტყელი დიზაინის დადებითი და უარყოფითი მხარეები

ამ სტილის გამოყენების უპირატესობებში შედის:

ვიზუალური საშუალებების შემადგენლობის სიცხადე და ლაკონურობა. საპასუხო ინტერფეისი "არაფერი ზედმეტი" სტილში, რომლის წყალობითაც მომხმარებლები სწრაფად აცნობიერებენ რისი გადმოცემა სურდათ მათთვის;

აქცენტი კარგ ტიპოგრაფიაზე. შინაარსი პირველ ადგილზეა, რაც უაღრესად მნიშვნელოვანია დღევანდელი ინფორმაციის სიმრავლეში;

ვებ გვერდების მცირე ზომა და საიტის უფრო სწრაფი შესრულება ვიზუალური ეფექტების მინიმალური რაოდენობის გამო. ეს განსაკუთრებით სასარგებლოა ადაპტური ვერსიების შექმნისას, რადგან რაც უფრო მარტივია ფორმები, მით უფრო ადვილია მათი ჩვენება მობილური მოწყობილობების მცირე ეკრანებზე.

ბრტყელ ვებ დიზაინს ასევე აქვს თავისი ნაკლოვანებები:

ვებ დიზაინერის ფანტაზიის შეზღუდვა გამარტივებული ფერებით, ტიპოგრაფიით და იკონოგრაფიით. აქედან გამომდინარე, მოსაწყენი და არაექსპრესიული ვებსაიტის შექმნის რისკი უფრო მაღალია;

სამგანზომილებიანი და ჩრდილების ნაკლებობა ზოგჯერ ართულებს იმის გარკვევას, ელემენტის დაწკაპუნებაა თუ არა;

კონკრეტული ფიქსირებული წესების ნაკლებობა.

თუ თქვენ გადაწყვიტეთ გამოიყენოთ ეს სტილი თქვენს საიტზე, გილოცავთ - ეს აჩვენებს, რომ თქვენ ზრუნავთ მომხმარებლის გამოცდილებაზე და ადევნებთ თვალყურს დროს. თუ თქვენ ახლა იწყებთ ვებ დიზაინერად და არ იცით როგორ სწორად გამოიყენოთ ბრტყელი დიზაინი, რათა თქვენი საიტი გამოიყურებოდეს აქტუალური გამარტივების გარეშე, სცადეთ ეს რჩევები:

დაივიწყეთ "აგურის კედლები" და ნათელი ფონი. ბრტყელი ვებ დიზაინი ჩვეულებრივ იყენებს მარტივ, გლუვ, რბილ სურათებს ფონისთვის.

ვებ განვითარების თანამედროვე ტენდენციები და მიდგომები

ისწავლეთ სწრაფი ზრდის ალგორითმი ნულიდან ვებსაიტის მშენებლობაში

არ არის გრადიენტები, 3D ხატები, ანიმაციური გადასვლები ან სხვა სპეციალური ეფექტები. ეს ყველაფერი თქვენს საიტს დამძიმებს და აურზაურს - გჭირდებათ ეს?

გამოიყენეთ ბრტყელი ხატები მკაფიო კონტურებით, რომ დაამატოთ მოხერხებულობა და ფუნქციონირება.

გამოიყენეთ ნათელი, მდიდარი ფერის პალიტრა. ახლა ტენდენცია არის მზის სპექტრის ტონები: ღია ყვითელი, ვარდისფერი და მწვანე. მთავარია არ გადააჭარბოთ – გვერდზე 3 ფერზე მეტი არ უნდა იყოს.

ფოკუსირება ტიპოგრაფიაზე. ბრტყელ დიზაინში უპირატესობა ენიჭება ნათელ, ორიგინალურ წარწერებს, რომლებიც ქმნიან მოწოდებას მოქმედებისკენ და უზრუნველყოფენ მარტივ ნავიგაციას საიტის გარშემო. აქაც მნიშვნელოვანია, რომ ზედმეტი არ იყოს. დაივიწყეთ „ხელნაწერი“ და სხვა ლამაზი შრიფტები. დიდი ასოების გამოყენება შესაძლებელია სათაურების ხაზგასასმელად.

მოგერიდებათ გამოიყენოთ სხვადასხვა გეომეტრიული ფორმები. კვადრატები, წრეები, ხაზები და სხვა ფორმები არა მხოლოდ გააუმჯობესებს ვებგვერდის სტრუქტურას, არამედ შექმნის მკაფიო იერარქიას და ყოფს შინაარსს. მომხმარებლები დააფასებენ ამას, მერწმუნეთ.

მაქსიმალურად გაამარტივეთ ნავიგაციის მენიუ და საიტის სხვა ელემენტები. ღილაკებისთვის გამოიყენეთ ჩვეულებრივი მართკუთხედები ჩრდილების ან ხაზგასმის გარეშე.

ამრიგად, წლების განმავლობაში, ბრტყელი დიზაინის ვებსაიტები იქცა აბსოლუტურად ყველასთვის მიღებულ სტანდარტად. შეხედეთ უამრავ თანამედროვე ვებსაიტს - ისინი ბოლომდე ბრტყელია.

და ბოლოს, მე მოგცემთ წარმატებული ბრტყელი დიზაინის დაპირებულ მაგალითებს, რომლებიც შეიძლება გახდეს შთაგონება თქვენთვის საკუთარი შედევრების შესაქმნელად.

1. საიტი http://dunked.com.

პოპულარული პლატფორმა პორტფოლიოების გამოქვეყნებისთვის, რომელიც გამიზნულია სხვადასხვა შემოქმედებითი პროფესიის წარმომადგენლებისთვის. მინიმალისტური ბრტყელი ვებ დიზაინი იწვევს საიმედო და გასაგები სერვისის განცდას, რომელიც არ აშორებს ყურადღებას ზედმეტი სპეციალური ეფექტებით.

2. Microsoft-ის ინტერფეისი.

Microsoft არის ერთ-ერთი კომპანია, რომელმაც ასე პოპულარული გახადა ბრტყელი სტილი. იქნებ გახსოვთ Zune პლეერი, iPod-ის კონკურენტი, რომელიც მაიკროსოფტმა გამოუშვა 2000-იანი წლების შუა პერიოდში? ამრიგად, ამ პროდუქტის დიზაინი მკვეთრად განსხვავდებოდა იმდროინდელი აპლიკაციების უმეტესობისგან, დიდწილად დიდი ტიპოგრაფიის, ბრტყელი ხატების, დიდი და ნათელი ფორმების გამო.

ეს ინტერფეისი, რომელსაც მეტრო ერქვა, მოგვიანებით გადავიდა პერსონალურ კომპიუტერებზე (Windows 8 OS), Xbox 360 ინტერფეისზე და სხვა Mircosoft პროგრამულ პროდუქტებზე.

3. საიტი http://www.vox.com.

აბა, შთაგონებული ხარ? ძირს ფსევდორეალისტური 3D ესთეტიკა!

სულ ესაა. გამოიწერეთ და გაუზიარეთ ჩვენი სტატიები მეგობრებს სოციალურ ქსელებში. მაღალი კონვერტაციები თქვენ!

ვებ განვითარების თანამედროვე ტენდენციები და მიდგომები

ისწავლეთ სწრაფი ზრდის ალგორითმი ნულიდან ვებსაიტის მშენებლობაში

ბრტყელი დიზაინის სტილის ვებსაიტები ჰგავს მარტივ გეომეტრიულ ბლოკ სივრცეს ფერადი აქცენტებით (ხატები, ტექსტის ხაზგასმა, ინფოგრაფიკა) მინიმალური გრაფიკული დეტალებით და ზედმეტი ტექსტური ინფორმაციის გარეშე. როგორც ამბობენ, "მინიმალიზმი" და არაფერი ზედმეტი.

როგორ არ დავხატოთ ბრტყელი ხატები

„ბრტყელი“ ვებსაიტის დიზაინი მოდური გახდა Windows-ის ახალ ინტერფეისებთან ერთად. ამ სტილის პოპულარობას რუსეთში ხელი შეუწყო თვითნასწავლი ვებ დიზაინერების რაოდენობის ზრდამ, რომლებმაც არ იციან, რომ ვებსაიტის ინტერფეისი და „თითის“ ინტერფეისი (სმარტფონები) არ არის იგივე (გადახვევა ადვილია. ჩამოწიეთ გვერდი თითით - და, პირიქით, დაგჭირდებათ დიდი მოთმინება და რეალური ინტერესი მაუსის ბორბლის 3-4 ეკრანზე გადაქცევისთვის). რუსულ ბრტყელ საიტებზე ხშირად შეგიძლიათ იპოვოთ შემდეგი ხატები:

მაგალითი არის მხოლოდ ნათელი ფერები, რომლებიც არ ემთხვევა ერთმანეთს + უხარისხო ხატები (მაგალითი ავიღე ფასიანი ნაკრებიდან, მაგრამ თითქმის ყოველთვის ფრილანსერები იყენებენ თავისუფლად ჩამოტვირთულ ხატებს სხვადასხვა ნაკრებიდან, რომლებიც ასევე არ ემთხვევა ერთმანეთს).

მაღალი ხარისხის გრაფიკის დახატვის შეუძლებლობის გამო, დამწყები დიზაინერები ადვილად ითვისებენ შესაძლებლობას, გაამარტივონ ყველაფერი. ამავდროულად, შეუმჩნეველია, რომ დიზაინი „მინიმალიზმის“ სტილში გულისხმობს ინტერფეისის დეტალების ზუსტად მაღალხარისხიან დამუშავებას და არა უბრალოდ ინტერნეტიდან გადმოწერილი ხატების განთავსებას ფერად კვადრატებზე Windows 8 სტილში (რომელიც ახლა შეგიძლიათ ნახოთ. ბევრ სავარაუდო „თანამედროვე სადესანტო გვერდზე“).

კარგი ბრტყელი ხატების მაგალითი:

ფერები და ხატები არა მარტო უნდა იყოს ერთმანეთთან შერწყმული, არამედ ერთი მთლიანობაც უნდა იყოს.

დაბალი ხარისხის ბინის დიზაინის პრობლემები

1. ნავიგაცია და გამოყენებადობა

ქსელი არ არის რეალური სივრცე, ამიტომ, რეალობის განცდის შესაქმნელად და თქვენი მდებარეობის გასაგებად, საიტები იყენებენ „პურის ნამსხვრევებს“, ხოლო ხატების სურათები ახლოსაა რეალურ ობიექტებთან სწრაფი გაგებისა და ნავიგაციის გასაადვილებლად. ასე რომ, სახლის ხატიდან დაუყოვნებლივ ირკვევა, რომ ეს არის "სახლი", ტელეფონის ხატით - რომ ეს არის ტელეფონი, კალათით - რომ ეს არის კალათა (როგორც სუპერმარკეტში - ყველაფერი ნათელია და მარტივი), ხატი საჩუქრის სურათით - საჩუქარი და ა.შ.

თუმცა, ახალი ბინის დიზაინერები ხშირად ზედმეტად ამარტივებს ხატებს. და რაც უფრო მეტი დიზაინერები არიან ინტუიციური სურათებისგან, მით უფრო რთულია მომხმარებლისთვის მათი ინტერპრეტაცია. ზედმეტი გამარტივება ზოგჯერ ართულებს ნავიგაციას. როგორც კი ყველამ იჩქარა შექმნას მოდური ბრტყელი ვებ-გვერდის დიზაინი, ცდილობდა მიბაძოს ევროპელი დიზაინერების, გამოყენების მარტივი წესები დავიწყებას მიეცა.

2. ბრტყელი ფეხის გრძელი სახვევები

გვერდები გადაჭიმულია 3-4 ეკრანზე, ხოლო სივრცე არა მხოლოდ ზომიერად გამოიყენება, არამედ, პირიქით, ემატება ზედმეტი "ჰაერი". ამავდროულად, არ არსებობს გადახვევის ვიზუალური მოტივაცია - ჩიპები, ანიმაცია. როგორ აპირებდნენ დეველოპერები ვიზიტორების დაინტერესებას გვერდის ქვემოთ გადახვევით, გაუგებარია. ბოლოს და ბოლოს, იმ საიტებთან შედარებით, სადაც ყველაფერი კომპაქტურია, ფეხსაცმლის საიტებს დიდი ენერგია სჭირდება მაუსის მთელ ეკრანზე გადასაადგილებლად და გადახვევისთვის.

3. დამაბნეველი ღილაკები

ბრტყელ საიტებზე აქტიური ელემენტები აღარ არის აშკარა. ბრტყელი დიზაინის მოსვლასთან ერთად, ღილაკებიც ბრტყელი გახდა. მაგრამ ღილაკის ვიზუალური გამოსახულება მომდინარეობს რეალური ფიზიკური ღილაკიდან და ჩრდილები და გრადიენტები უბრალოდ აჩვენებს, რომ „აუცილებლად შეგიძლიათ დააწკაპუნოთ აქ“.

4. ცუდად დახატული ხატები

დიზაინერების უხარისხო მუშაობის გამო, საიტებზე ხატულებმა (ეს განსაკუთრებით შესამჩნევია ბრტყელი სტილის ვებსაიტებზე) დაკარგეს პროგნოზირებადი გამოსახულებები. ან დიზაინის შეზღუდული ბიუჯეტის გამო, ან თავად ვებ დიზაინერების არაკომპეტენტურობის გამო, საიტებზე ნავიგაციის ელემენტები ხშირად არ შეესაბამება პირველადი ასოციაციების და არის "შორს წასული".

ვვარაუდობ, რომ ხატების შექმნაზე მუშაობა დაახლოებით ასე მიდის: ტექნიკური მახასიათებლების მიხედვით საჭიროა ხატი „ინდივიდუალური მიდგომა კლიენტებთან“. პირადად მე მაქვს მენეჯერის და ორი კლიენტის იმიჯი, რომელთაგან თითოეულს მიჰყავს განსხვავებული ფერის ისარი (ლურჯი ისარი მივყავართ ლურჯ კლიენტს, წითელი ისარი - წითელ კლიენტს). თუ დიზაინერმა ხატვა არ იცის, ხატს მზა კომპლექტებში დაეძებს (საუკეთესო შემთხვევაში ფოტობანკიდან იყიდის, უარეს შემთხვევაში ინტერნეტიდან ჩამოტვირთავს) და გამოიყენეთ ის, რაც მნიშვნელობით ყველაზე შესაფერისია. სავარაუდოდ, ეს იქნება ჰალსტუხიანი ან ჩემოდანი კაცის ხატი. ზოგადად, ის არც თუ ისე შორს წასულა, მაგრამ მაინც საიტის დიზაინში გაირკვევა, რომ ჩემოდანი „ყველასთვის ინდივიდუალური მიდგომისთვის“ და საათი „10 წელი ბაზარზე“ (სხვათა შორის, მე რეალურად ვნახე ეს!) – მოატყუა დიზაინერმა.

5. ყალბი შინაარსის ფოკუსი

ბრტყელი ვებსაიტის დიზაინი ითვალისწინებს კონტენტზე ფოკუსირებას. კარგად, ცხადია - თუ აქცენტი არ არის გრაფიკაზე, მაშინ ინფორმაციაზე. მაგრამ თუ ყურადღებით დააკვირდებით რუსული ვებ სტუდიების მიერ შემოთავაზებულ „თანამედროვე“ ბრტყელი სტილის სადესანტო გვერდებს, მცირე ყურადღება ეთმობა შინაარსს. კერძოდ:

• ტექსტი წარმოდგენილია უაზროდ. გაუგებარია, როგორ არის მოთავსებული მასში აქცენტები, რაზე უნდა მიეკრათ და რა არის მეორეხარისხოვანი.
• დიზაინი, როგორც ასეთი, არ არსებობს. ცხრილები, ბურთულებიანი სიები, სათაურები, განცხადებები ხშირად საერთოდ არ არის შემუშავებული.
• ხშირად შიშველი ტექსტი. არ არსებობს სურათები ან ხატები ტექსტის ბლოკების ვიზუალურად მხარდასაჭერად. შედეგად, აქცენტი კეთდება არც გრაფიკაზე და არც ტექსტზე, არამედ თავად „სტილზე“. ამავდროულად, კომპანია და მისი შეთავაზებები იკარგება.

ანუ ბრტყელი დიზაინი საერთოდ აუცილებელია ვებსაიტებისთვის?

ყველაფერი ნათელია სმარტფონებისთვის ინტერფეისების დიზაინში - მსუბუქი, დატვირთული, მარტივი გამოსაყენებელი. მაგრამ ვებ-გვერდის დიზაინის ბრტყელი სტილით, მე პირადად მაქვს დიდი კითხვა: არის თუ არა ის საერთოდ ეფექტური?

მომხმარებელთა უმეტესობას არ ესმის გრაფიკის ხარისხი და ვებსაიტის დიზაინის დამტკიცებისას ხელმძღვანელობენ მათი პირადი გემოვნებით (მოწონება/არ მომწონს). და აქ მოდა თამაშობს როლს.

ბრტყელი ვებსაიტის დიზაინი შეიძლება მაგარი იყოს. მაგრამ! მაგარი დიზაინი მოითხოვს გამოსაყენებლად და გრაფიკული ელემენტების ნამდვილად მაღალხარისხიან დიზაინს და კრეატიული მახასიათებლებისა და ეფექტების არსებობას. და თუ ისინი არ არიან დიზაინში, თუ საიტებს აკლიათ ორიგინალობა, ისინი გამოიყურება ერთფეროვანი, ცარიელი და მოსაწყენი. ზოგადად, ეს არის ის, რაც ახლა ხელმისაწვდომია უმეტეს რუსულ საიტებზე.

მაღალი ხარისხის ბრტყელი დიზაინის მაგალითი:

ბრტყელი ვებსაიტის დიზაინის მოდა დროებითია, როგორც ნებისმიერი სხვა მოდა. ზოგიერთი ადამიანი ქმნის ორიგინალურ, კრეატიულ დიზაინს, ზოგი კი მათ კოპირებს და სტილში ბაძავს, რადგან არ იციან როგორ მოიფიქრონ ისინი. და იაფფასიანი „მოდის“ საიტები სოკოსავით იზრდება...