გეშტალტის პრინციპები ვებ დიზაინში ნაწილი-2

 გეშტალტის პრინციპები ვებ დიზაინში

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

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

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

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

ეს პრინციპები ემყარება ექვს მთავარ კატეგორიას:

  1.  ფიგურა და ფონი (FigureAnd Ground),
  2.  სიახლოვე (Proximity),
  3.  სიმეტრია და წესრიგი(Symmetry And Order),
  4.  მსგავსება (Similarity),
  5.  ჩაკეტილობა/სისრულე (Closure),6.   უწყვეტობა (Continuity)

ფიგურა და ფონი

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

გრაალის თასი

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

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

ფიგურის და ფონის ურტიერთქმედება

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

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

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

სიახლოვე

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

სიახლოვე დიზაინში

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

აი მაგალითიც:

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

 

სიმეტრია და წესრიგი

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

სიმეტრია და ასიმეტრია

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

სიმეტრია ვებ დიზაინში:

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

მსგავსება

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

მსგავსების პრინციპი დიზაინში

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

ჩაკეტილობა/სისრულე

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

ჩაკეტილობა დიზაინში

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

მაგალითისთვის ვნახოთMagu Kombucha-ს   საიტი:

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

ამ მაგალითში თქვენ ხედავთ, რომ ჩაკეტილობის პრინციპი გავლენას არ ახდენს ფიგურის ფონის პრინციპზე. ბოთლები და მატ უკან მდებარე სქელ შრიფტიანი ტექსტი — ფიგურაა, უწყვეტი ღია ვარდისფერი ფერი კი -ფონი. სად არის სისრულე? მიაქციეთ ყურადღება ბოთლების უკან არსებულ ტექსტს. ის არ ჩანს მთლიანად, მაგრამ ვიზიტორები, რომლებმაც იციან ლათინური ანბანი ადვილად შეზლებენ სასმელის სახელის ამოკითხვას — Kombucha. თქვენ დასაწყისში და ბოლოში  ხედავთ ასოებს  «Кo»  «ha»  მთლიანის სიტყვის ამოცნობა ხდება ინტუიციურად ,რის შედეგადაც ყალიბდება მთლიანი გასაგები, აზრიან სურათი. ეს სისრულის კარგი მაგალითია!

უწყვეტობა(Continuity).

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

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

უწყვეტობა  დიზაინში

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

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

მაგალითი:

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

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

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

მხოლოდ ორიგინალური გადაწყვეტილებები - Lemons.ge 

მისამართი: წერეთლის გამზ. #117ა

ელ. ფოსტა: info@lemons.ge 

ოფისი: ( 995) 032 2 45 01 01

გეშტალტის პრინციპები ვებ დიზაინში  ნაწილი-2

სხვა სიახლეები