UX/UI   .   ,       
 


   ?  ? ,    ,    ?

       UX/UI .     ,     .

 :

,    .     ,    .

    ,   .        .

   .   ,        ,  .

   .    ?,  ,    .

,    .         .

  18 , 6     .   ,    ,     .

 :   , , ,   ,    .





 

UX/UI   .   ,       











   ,    ?


 - ,       ?  ,    ,   .

     .       ,      :

   ?   ?     ?      ,    .    .    .

      .         .    ,      :  ,      ,     ,     .   ,  .    ,    ,   ,   .      ,     ,   .

         .  ,  ,   .   ,          Figma.

?

     .   ,   ,    .     .  ,     ,  ,       .

     .




   


      .  :  ,     .

          ,     .   ,      ,     .  ,   ,    ,     .

  UX-.   ,  UX-. 25     ,        UX-.

    .         ,    ,     .      :   -    AI    .

   ,   . ,        ,   .




   


  ,     ,   .  ,       ,       .

    ,   ,   -      .                .

    ,   ,    ,     ,     .  ,           .

 ,  ,    ,  ,    ,  ,    .      -   -      .




   


    ,           .



 1.  ,    ( 15)

 ,    .   ,         .      .  ,     ,     ,       ,   .     ,     .    , :

       ( 1);

  ,      ( 2);

   ?    ( 3);

   ,     ( 4);

   ,      ( 5).



 2. ,     ( 68)

    ,    ,      .           ,     ,   .

 :

           ( 6);

          ( 7);

           +  ( 8).

    -  -,    .



 3.        ( 910)

      ,       :      (   )      (     ).

 :

           ( 9);

             ( 10).



 4.    ( 1114)

    ,       ,    .  2026    ,   ,   .

 :

          ( 11);

     2026         ( 12);

  ,         - ( 13);

  AI      ,     ( 14).



 5.    ( 1516)

  ,          ,     .

 :

          ( 15);

  -       ( 16).



 6.   ( 1718)

  ,     ,   ,  ,   -.

 :

 ,     ,       ( 17);

          ,   ( 18).

       ,       ,      .




   


       ,    ,     .      .    ,    .

     :

     ;

       ;

-    ;

FAQ       .

      ,   ,      .



  - 

     ,    .   .    ,      .

    ,    .        ,        .




 ?


         -        .

           UX-    Litres (https://www.litres.ru/74176677/).     25 ,        ,   .



    .



   .



   .



    :     .       .       .

 , ?






 1.  DRIBBBLE:        





1.1. 


      ,        :      .   ,            Dribbble.

    .      ,        .      ,    . ,     .  ,    .




1.2.  . 


   .            .   ,    : , , , .

  Figma   .

 ,     , ,  ,    .   Dribbble  Pinterest:    ,    ,   ,    .

   .   .       -.

     .

     60,        .   . . .          ,      .        ,   ,      .

--.

  :

 ,   ?      ?    ?     ,    ,          .    ,        .       . .  .  .

          .    ,     .

 .   ,  ,   .     15   :   ,  ,  ,  ,    .

  : ,     .   ,    .

  70% .  -    ,  ,  .

:    . .

       :         .   .      .




1.3.  . 


     .         .      Figma,   .

     :

 ?, 2050 ,     .   .   .

  ?        .

  ?, , ,   .

          .  ,  ,  .  .  : ,   .     ""    ?

  . .

  Figma   20   ,  : ,   ,  ,     .  . ׸ .

     .

    4 .   3   2 .

  ?








  .   .

    : , , -.   :   !  :   ,  ,   ,   .    .




1.4.    Dribbble    


       Dribbble    .

Dribbble   ,     : , ,     .     ,  ,       ,   .

  ,     ,     .    : ,      ,    .    ,   .   :    ?

   :          ,    .       UX.   .

UX   ,    ,  ,  ,          .

   Dribbble  :

       ,       .

   15 , 7 ,    .

        .

    ,  ,  .

    ,  hover/active/disabled  .




1.5.   


1.5.1.      Dribbble

 1.    

            .    ,   ,  ,     :  ?,  ?,    ?

   :

 .    ?  :   ?      ,   . UX-   ,    Figma.

 2.  

  Dribbble  Behance,       ,    .   ,  ,  ,  .

   :

 ,   .    ,  ,   ,   .     ?    ?         .

 3.  

 ,      .    ,  ,     ,   ,       .

   :

   .         .      ,  .




1.6.   


1.6.1.  .   

  ,    ,   .     ,     .     ,          .

  :

    ,     ,    ,      .

              .      :  ,     ,      .

 :

 ,     .       , ,  ,     . :          ,   .    .

    .

     .   !     .

     :

  ?    ,      .          .

  ,    ?    ,       .       .

   ?      .      .

 ,       .

 .  .

 ,   .        ,     ,      .

  :   ,        ,   .    ,    .

     ,        .    ,    ,  :     .     ,     :   .

 2.  .

    .   ,         ,   ,   .

     ,           .     .

   ,  ,         .  .     .       .   ,         .           !      ,    .

         ,      .

 3.   .

     .  ,  .      .

       .   ,    .   ,     ,    .  ,    ,       ,  -   .

 .   ,    :      ?       .  :   ,      .      .

   

 :

   ,     .

          .

  ,    ,       .

   ,   .

  :

   ,         .

 :  ,        .

        .

         .



  ,  /  :








-    :

    ,     .                   .

 ,        .

    (, , ).

    2-3  .

     (, , ).

    (  ).

         .

  ,     .

1.6.2.  .  

      ,   .       ,       .

   ( ,    ):








     ?

         ,         .        :   ?

          .

   ,     -   .

1.6.3.  .    

    ,   ,   .         .

    (8, 12  16    )          .

   (4, 8  10 )          .

,            .

   2      .

           .

1.6.4.  .  

 ,      :  .




1.6.5.  5.    (Accessibility)

   .    . 1520%    , ,         20% .

   :











1.7. :  


   ,          Dribbble:

  .   Figma.  ?   ?   ?

  .   .  ,  .

   Figma  .  , , .  .

    .  ,    ,   .

   .       .       .

 . .  .  .

  / .   ,   .




1.8. 


 Dribbble      ,   .     ,       .

UX-     .   ,        .

          ,       .

   , ,      ,   .

        .

       .

   ,    .




1.9.  


    (  ,    ).

   5   3  .

     :  ,  ,   .

:       ?

    ,  - .




1.10. -    


?      .

?     3  .

?     .

?     (  ).

?  : hover, active, disabled ( ).

?     (  1618px,  4.5:1).

?     44x44px ( ).




1.11. FAQ


      ?

  :         . ,        .     .

   Dribbble    ?

.      UI,    UX.       Dribbble  .       ,    .

          -?

    ,     . ,  ,  , .          .

  ,     ?

   5 .     ,      .




1.12.    


   .    Dribbble  ,       .   ,     5 ,           .

     .       ,     .   .     Figma.   ,   ,      .

    ,      .   ,    ,   .      .         .

   ?    .

   :       ,   ?   ?




 2.   :      





2.1. 


   . ,     ,  ,   ,     .         ,     . ,   : ,      ,    ,  ,      ,           ,       .

  .  ,   .

    ,        .      5 ,      UI  UX.

    .

     ,  ,        .     ,   . ,    ,   .   ,    ,   .

    ?         ,  .  ,      .    : ,  ,  .   .

     .     .      .




2.2.  . 


 ,   .    .

       ,     .   ,   ,   - .      .

     ,      : ,   .     ,     .  ,  .      :     ,        .

 .          .   Figma,      : ,     .  ,   .  : , , . .

      ,  :  ,  ,   ,     ,    ,     .    .      .

     .  ,   :

 ,        45+,     .       ?         20%.

 .          .  .    ,    ,         .        .

     ,      ,      :   ?     ...




2.3.  . 


           .

    Figma.   .

  :  ?   ?    ?

 :     45+.     .     .    .

  :     ?  ,   ?

 ,          +20% .

  ,  : , ,   .   ,   .

  .    : .  ,   .  ,   .

    2 ,     .   2      .

  ?








 .  ,      .     ,  .        .




2.4.         


             .         .

      :

  ,   :   ,    .

     :    ,   .

  :   ,    .

    :  ,    .

  ,   : ,   ?    :  .     .

  :

        ,    .

        .

      ,   .

       ,    .

       ,   .

    :

    ,  ;

     ;

  ,     ;

     .




2.5.   


    ,  ?

 .     .

 1.      

 :   -    .     ,  ,  ,       Figma   !     ,      .

   :

       .   .      15  20 .      30 .      10 .

   .     ,    .     ,   .

   -      ,    .  ,     ,      .

 2.    

   .   ,  ,   .     .   ,    Figma     .     .           .

   :

 :    .  , ,       ,   .      :

   .   ,       :  ,        . ?

     .   . ,   .    .

     .   ,    X     510 .         .

 :        .       .  .

 3.    

 ,  ,     .   ,   . ?

      .

   :

      .     .

    ?   .

    ?    .

     ?       .

 .       -.       .           ,   .

 4.    

   ,      ?      ?  .        ,   ,   .

   :

   .     ,   .    ,  .

 :           ,      ?

    :

    ;

     ,      ;

  ,      .

    :

    ,   ;

   ;

    .

    .   .   :    .     .    ,    .                  ,    .




2.6.   


2.6.1.  .    

        ,            ?.

 :

     ,    :

 ,     [],  []  [],   [].

,  :

 ,    [],   [].  .

:

:    .

:  ,        1825 ,         .        .

 :       ,    .

  :  

          :

  [ ], [] [ Y],    [  Z],   [].

  - :

        ,       ,      30%   ,   60%       .

   ,  ,   .            ,   ,    .

2.6.2.  .      

      ?  .   ,      .

 1:  

   .             .

 :

 :     ?        Y?.

   .

 .

 .

:

  ,         .    :          ?   : ,    . :    .

:

   ,     .

  ,    .

         .

 2:  

   ,         .             .

 :

     (   ).

  .

    .

 :     ?

:

    -. : 30%     ?, 20%      , 15%     . :      ,      .

  :

 .

     .

  ,     ,  ,   .

 3:Shadowing      

    :    ,     ,   .

 :

    .

     (,      )    .

 .  .  .  .

 ,   ,     ,   .

:

 ,      -.   iPhone 15   ,  Enter,     .   ,    .  :      .           .

  :

    ,    ,   Figma.

 .

   ,     .

2.6.3.  .      ,  

   ,     .     ,    ,  .

     :

     [],  : [].     [],      [].

:

          . ,  60%          .        ,          .       .

    .      ,         .




2.7. :  


     ,   , ?

       ,       .

 .      .     .

       ,     .




2.8. 


    .     ,    ,   .

 ,  .        ,   Y,   Z.

   .    ,       .

   .          .

    ,  .        .




2.9.  


    (   )    :

 1.  

    :

   [],    [Y],    [Z],   [].

 2.  

       .   .  :    ?

 3.  (  )

        . ,     .




2.10. -  


?   ,     .

?       (, , ).

?   ,     ,   .

?    ,   .

?  ,   ,    .




2.11. FAQ


  ,        ?

    .  ,  , .       .    .

        ,  ?

          .     ,   .

  ,    ,   ,    ?   .

  .  !     ,     .     .     .

   ,          ?

  :        ,    ,    ,    ,       ,  .   ,      .

   ,    ,      ?

       .    ,         ?   .       ,     .

   :    .   ,      .        ,    .

      :

       ?        .  .

        , ,   ,        .    ,       .

   ,           ,    .

  ,         ,     .           .




2.12.    


   .   ,      ,  .    ,         ,    .

  .        :  ,  .             ,   .   .  ,      .

    .

    ,         .       .     ,       .

   :       ,  ?   ,   ?




 3.   :       ͨ





3.1. 


       :  Dribbble (     )     (    ,  ).       ,        .

   .   ,        ,  .  .  .  .

     ǻ,      .         .

       Figma.  ,   ,   .  .   ,   .      ,     , .

   ,      ,   ,   ,   ,  .    ?    .     :   ,      .

     (     )     ,          .

   .     -  ,     .    ,   ,      -.        :

   ;

    ;

    .

     .  .   .




3.2.  .   


 ?              .   : ,    .

      :

 !   -    .  ,   ChatGPT.

  Figma.  .     : -? ?       .      ,       ?

  .      . ,  .

 . . - .

 . :   3% .    ,   .  :

   ,    .      ?

   :

   .    ,     ?

 .  ,  .     ?




3.3.  . 


   -,      :

 !   -    .

    Figma.       :

 ,  ,  ,  ,  :   -?    ?

 :

     .    .

:

 .     ?    ?  ?    ?

:

 , ,     .

:

 .      ?    , ?

:

 .

:

     .        ?      ?     ?

  .    :

80%       1015 ;

  60% ;

      .

  :    -.      .

  :

   .           .    -,     ,     .     : 20%       . ,  -    ?

   ,   :

  ,  .   .

    .        15%.   .

     2 .   3    -   .

  ?








  ,  ,    .  ,      Figma,      .     .      .




3.4.     ǻ    


 :   ,  ,   ,   .

        ,    .        .  .      ,    ,   .        ,   ,  .

     ,     ,  ,    ,  .          ,         .

      :

   :   .

   :        .

   -:   ,   .

    :  ,  ?

    :   .

  :

        .

     ,   .

         .

         .

         .

    :

    ;

      ;

   ,    ;

     .




3.5.   


3.5.1.     

  ,       , ,  .

 1.     

 , ,         ?,    .     ,     ?    .

   :

     .  . ,   ,   ,    . ,    ,   ,   .

   .       :     .   ,     :  ,     .

:          .     .   ,     .

 2.      

    .   //  ,  .  ,   .

   :

    .  .    .        ,     ,  .

     ,    .  :  -  ?,    ?,    ?.    ,    .

  .  ,   .   .    .

 3.    

   ,        .     .

   :

  ?  1 .    10 .   ,    .

    ?    .

    ?     .

   , ? ?     .

       .    ,     .

 4.   ,   

   .   ,      .       .

   :

  .    .

  .  5W- (     ):

?    ?

?    ?

?   ?

?    ?

?    ?

    80% ,   ,    .

   :    ,      .    ?,    ?,   ,   ?.      .




3.6.   


3.6.1.  1.   ? (5W-)

          .     5W-:

What (?)   ?    ?

Why (?)    ?   ?

Who (?)     ?   ?

When (?)    ?   ?

Where (?)    ?   ?

.    

    :

  ?     .



 ,   .

   ?    .



  ,    .

    ?   ,     .



   .

   ?     .



 ,    .

   ?      .



   .

   :   ,              ,   .

3.6.2.  2.    

 ,   :

 .

 :      ?

   :   [ ]  [].

 23   (  ,   ).

:

:    .

:         .  : , ,  ,      .

   ,   ,      .

3.6.3.  3.  

  ,  ,   ,   .

:

    ( ).

 12   ( ,   ?).

   :     ,    ,    .

   .

  :








  :

     ,     ,  ,       .    ,       30%   .

3.6.4.  4.      

    ,     .

 1.   

   ,  .

     .   /-:    ,   .   ,      .          .

      ,   .

 2.   

       .

   , 70%   ,  .      .    .

 3.   

     -.

    ,        .    ,       ,   .

3.6.5.  5.     

  ,    ,    ( ),    .

 :

:      .

: ,  , ,   ,  :   ?    ?

:     .

: .      ?     ?

:  ,    .

:    .   ,   .     ,           .     ,    . ,  ,    /-  ,   .   ?

:  .   .

 ?            .   ,   .

3.6.6. :      ,  

        .

   ?    ,   .

   ?     ,    .

    ?   ,   .

  ? , , .

    ?     .

3.6.7.  6.  ,     

  .       .

    :

   .

   :   ,   .        .    .

      ,        .

    :

   -   ,    .  :

   -,   .      :       . -    ,     ,     ,   .          ,   .    ,     .      ,   ,    -.        .

 . - ,    .            3   ,         .

  ,   ,     -.     .




3.7. :  


   ,         :

 .

  ?     ?

            Y.

 23     ,   .

      ,   .

      ,    .




3.8. 


   .  .         .

  ?.       .

 . ,   ,    .

   .  ,   /-.

  -,   .      .




3.9.  


    (   )    .

 1.  

          .       ?.   ?   .

 2.  

      2  . ,     .   .

 3.  

,      -,     .        . ,          .




3.10. -  


?    ?  ,    .

?  ,    .

?  ,        .

?   ,       ǻ.

?   ,     .

?       .




3.11. FAQ


              ?

       .      :  ,   ,       .     .      ,    .

          ?

  ?   .    .   .  .

     ,   ,    ?

    ,      .  :   ,       .      .    .

    .    ,    .                 .  ,     .  :         ,       .         ,     .

  ,    ,   ?

 ChatGPT  ,    .    :      ?.    ,   .

     ,        ?  ,   ,   ?

        .     ,   .          ,   .

   ,        :      ,   .         .   ,           .

         :

     (,    ).

       (,      ).

       .   , ,  .    .    ,    .




3.12.    


   .   ,     ,    ?   .         ,    ,     .

  .     ,       , ,  .      ,  ,  ,    .   .      .

    .

     .  .  .  .

 ,      ,  ,  .       .    ,     .     ,      .

    .     MVP (   ,        ).   ,   .     .      :  ,        ?

    ,        .  ,   MVP     .    ,     .

   :      ,   ?




 4.   :    





4.1. 


      :  Dribbble (     ),    (    ,  )    ǻ (   ,   ).       ,        .

   .  ,      .        .     ,      .

     ,    over-engineering  .         .

   .   .     .

     .        :  , , , .   ,     .

  ,    .   .   ,      .

     Dribb




  .


   .

   ,     (https://www.litres.ru/book/ekaterina-markevich-33983787/ux-ui-dizain-kak-sistema-kak-prinimat-resheniia-rabota-74495914/)  .

      Visa, MasterCard, Maestro,    ,   ,     ,  PayPal, WebMoney, ., QIWI ,       .


