À¥À» ÅëÇØ »õ·Î¿î âÁ¶¸¦ ²Þ²Ù´Â Àΰ£ - kimdirector
kimdirector is Creative Web & Mobile UI/UX Planner and Designer
WEBDESK
Inspiration
HOME ¡µ WEBDESK ¡µ Inspiration
¸ð¹ÙÀÏ UI µðÀÚÀÎ ¾Ö´Ï¸ÞÀÌ¼Ç 3°¡Áö ¿øÄ¢
Posted by kimdirector | 2020.05.25 | Hit : 836
UX ¸ð¹ÙÀÏ ¾Ö´Ï¸ÞÀÌ¼Ç UI µðÀÚÀÎ
¸ñ·Ïº¸±âÀÌÀüº¸±â
¾Æ·¡ ³»¿ëÀº "3 Key Uses for Animation in Mobile UI Design"ÀÇ ³»¿ëÀ» ¹ø¿ªÇÑ ³»¿ëÀÔ´Ï´Ù. ÀÇ¿ªÀÌ ÀÖÀ» ¼ö ÀÖÀ¸¸ç, Ãß°¡ ¼³¸íÀ» µ¡ºÙÀÎ ºÎºÐµµ ÀÖÀ¸´Ï Âü°íÇϽñ⠹ٶø´Ï´Ù. ÀÚ¼¼ÇÑ ³»¿ëÀº ¿ø¹®À» È®ÀÎÇØ º¸½Ã±â ¹Ù¶ø´Ï´Ù.


Credits: Eddie Lobanovskiy

±â¼úÀÇ ºü¸¥ ¹ßÀüÀ¸·Î ÀÎÇØ ¾Ö´Ï¸ÞÀ̼ÇÀº ½Ã°¢Àû °í±Þ½º·¯¿òÀ» À§ÇØ »ç¿ëÇϱ⠺¸´Ù´Â »ç¿ëÀÚ°¡ ±â´ëÇÏ´Â ±â´ÉÀû ¿ä±¸»çÇ×ÀÌ µÇ¾ú½À´Ï´Ù. ¾Ö´Ï¸ÞÀ̼ÇÀº ÀÎÅÍÆäÀ̽º¿¡ Á¸ÀçÇÏ´Â ¸¹Àº ±â´ÉÀû ¹®Á¦¸¦ ÇØ°áÇØÁÖ¸ç ÀÎÅÍÆäÀ̽º°¡ »ý±â ÀÖÀ¸¸é¼­µµ ÁøÁ¤À¸·Î »ç¿ëÀÚ¸¦ À§ÇÑ´Ù°í ´À³¢°Ô ÇØÁÝ´Ï´Ù. ¸ð¹ÙÀÏ ÀÎÅÍÆäÀ̽ºÀÇ ±â´É¼º°ú °¨¼ºÀûÀÎ ÈûÀ» Çâ»ó½ÃÄÑÁÖ´Â ‘¾Ö´Ï¸ÞÀÌ¼Ç ÇÙ½É ¿ä·É’À» »ìÆìº¸µµ·Ï ÇϰڽÀ´Ï´Ù.
 
 
1. System Status
 
Ç×»ó ¾ÛÀÇ ¹é½ºÅ×ÀÌÁö¿¡¼­´Â ¸¹Àº ¼öÀÇ ÇÁ·Î¼¼½º°¡ ÁøÇà ÁßÀÎ °æ¿ì°¡ ¸¹ÀÌ ÀÖ½À´Ï´Ù. °¡·É µ¥ÀÌÅͰ¡ ¼­¹ö·ÎºÎÅÍ ´Ù¿î·ÎµåµÇ°í Àְųª, °è»êÀÌ ÁøÇà ÁßÀ̰ųª ÇÒ ¶§´Â ÀÌ·¯ÇÑ ÇÁ·Î¼¼½º¿¡´Â ¾ðÁ¦³ª ½Ã°£ÀÌ °É¸®±â ¸¶·ÃÀÔ´Ï´Ù. »ç¿ëÀÚ¿¡°Ô´Â ¾ÛÀÌ °íÀå³­ °ÍÀÌ ¾Æ´Ï¸ç ÇÁ·Î¼¼½º°¡ ÁøÇà ÁßÀÎ »óÅÂÀÓÀ» ¾Ë·ÁÁà¾ß ÇÕ´Ï´Ù. ÇÁ·Î¼¼½º¿¡ ´ëÇÑ ½Ã°¢Àû ½ÎÀÎÀº »ç¿ëÀÚ°¡ ¾Û¿¡ ´ëÇØ¼­ ÅëÁ¦°¨À» °¡Áú ¼ö ÀÖ°Ô ÇØÁÖ´Â °ÍÀÌ »ç¿ëÀÚ¿¡°Ô ¾ÈÁ¤°¨°ú µµ¿òÀ» ÁÙ ¼ö ÀÖÀ» °Í ÀÔ´Ï´Ù.
 
 
Loading Indicators
·Îµù ½Ã°£Àº ´ëºÎºÐÀÇ µðÁöÅÐ Á¦Ç°¿¡¼­ ÇÇÇÒ ¼ö ¾ø´Â »óȲÀÔ´Ï´Ù. ¾Ö´Ï¸ÞÀ̼ÇÀÌ ÀÌ ¹®Á¦¸¦ ÇØ°áÇØ ÁÖÁø ¸øÇϰÚÁö¸¸, »ç¿ëÀÚ¿¡°Ô´Â ºÐ¸í ‘±â´Ù¸²’Àº Å« ¹®Á¦°¡ ¾Æ´Ñ °ÍÀ¸·Î ¸¸µé¾î ÁÝ´Ï´Ù. ±â´Ù¸²À» ÁÙÀÏ ¼ö ¾øÀ» ¶§¶óµµ, ±â´Ù¸²À» Á¶±Ý ´õ Áñ°Ì°Ô ¸¸µé¾î ÁÙ ¼ö´Â ÀÖ½À´Ï´Ù. âÀÇÀûÀÎ ÇÁ·Î¼¼½º ÀεðÄÉÀÌÅÍ´Â »ç¿ëÀÚ°¡ Áö°¢ÇÏ´Â ½Ã°£À» ÁÙ¿©ÁÙ ¼ö ÀÖ½À´Ï´Ù. ¾Ö´Ï¸ÞÀ̼ÇÀº »ç¿ëÀÚÀÇ Á¦Ç°¿¡ ´ëÇÑ Áö°¢¿¡ ¿µÇâÀ» ¹ÌÃļ­ ½ÇÁ¦º¸´Ù ´õ ÁÁÀº Á¦Ç°À̶ó°í ´À³¢°Ô ÇØ ÁÝ´Ï´Ù.
 
 
±â´Ù¸®´Â Àá±ñÀÇ ½Ã°£ µ¿¾È Èï¹Ì·Ó°Ô º¼ ¼ö ÀÖ´Â ¹«¾ð°¡¸¦ »ç¿ëÀÚ¿¡°Ô Á¦°øÇØ Áشٸé,
»ç¿ëÀÚ´Â ±â´Ù¸² ±× ÀÚü¿¡ ´ú ÁýÁßÇÏ°Ô µË´Ï´Ù.
Credits: Ramotion
 
 
Pull to refresh
ÀÌ ±×·ì¿¡¼­ À¯¸íÇÑ ¾Ö´Ï¸ÞÀ̼ÇÀº “pull down to refresh” ¾Ö´Ï¸ÞÀ̼ÇÀ¸·Î, ¸ð¹ÙÀÏ µð¹ÙÀ̽º¿¡¼­ ÄÜÅÙÃ÷°¡ ¾÷µ¥ÀÌÆ®µÇ´Â ÇÁ·Î¼¼½º¿¡ Àû¿ëµË´Ï´Ù.
 
ÆÁ : pull down to refresh ¾Ö´Ï¸ÞÀ̼ÇÀº ¾ÛÀÇ µðÀÚÀÎ ¾Æ¿ô¶óÀΰú ¸ÅÄ¡°¡ µÇ¾î¾ß ÇÕ´Ï´Ù.
¾ÛÀÌ ¹Ì´Ï¸ÖÇÑ µðÀÚÀÎÀ» µû¸£°í ÀÖ´Ù¸é, ÀÌ ¾Ö´Ï¸ÞÀÌ¼Ç ¿ª½Ã ±×·¡¾ß ÇÕ´Ï´Ù.
Credits: Zee Young
 
 
Notifications
¿òÁ÷ÀÓÀº ±× ÀÚü·Î À̸ñÀ» ²ø±â ¶§¹®¿¡ ¾Ë¸²¿¡ ¾Ö´Ï¸ÞÀÌ¼Ç È¿°ú¸¦ ÁÖ´Â °ÍÀº »ç¿ëÀÚÀÇ °æÇè¿¡ Áö³ªÄ¡°Ô ħ¹üÇÏÁö ¾ÊÀ¸¸é¼­µµ Áñ°Ì°Ô ¾Ë¸²À» ÁÙ ¼ö ÀÖ´Â ¹æ¹ýÀÔ´Ï´Ù.
 

¿òÁ÷ÀÌ´Â ¿ÀºêÁ§Æ®´Â Áï½Ã »ç¿ëÀÚÀÇ À̸ñÀ» ²ø°Ô µË´Ï´Ù.
Credits: Arjun Kani
 
 
 
2. Navigation and Transitions
 
¾Ö´Ï¸ÞÀ̼ÇÀÌ °¡Àå ±âº»ÀûÀ¸·Î Ȱ¿ëµÇ´Â »ç·Ê´Â Àüȯ È¿°úÀÔ´Ï´Ù. ÆäÀÌÁöÀÇ ·¹À̾ƿô¿¡ ¹æ±Ý ¹ß»ýÇÑ º¯È­°¡ ¹«¾ùÀÎÁö, ¹«¾ùÀÌ º¯È­¸¦ Ã˹ßÇß´ÂÁö, ±× º¯È­¸¦ ³ªÁß¿¡ ´Ù½Ã ÁÖ·Á¸é ¾î¶»°Ô ÇØ¾ß ÇÏ´ÂÁö µîÀ» »ç¿ëÀÚ°¡ ÀÌÇØÇÒ ¼ö ÀÖµµ·Ï µµ¿òÀ» ÁÖ±â À§ÇØ ÀÌ·± À¯ÇüÀÇ ¾Ö´Ï¸ÞÀ̼ÇÀÌ »ç¿ëµË´Ï´Ù. °íÀüÀûÀÎ »ç·Ê·Î´Â ¼û°ÜÁø ÄÜÅÙÃ÷¸¦ º¸¿©ÁÖ´Â Çܹö°Å ¹öưÀÌ ÀÖ½À´Ï´Ù.
 


¸ð¼Ç µðÀÚÀÎÀº Á¤º¸¸¦ Àü´ÞÇϸ鼭µµ Àç¹ÌÀÖ´Â ¹æÇâÀ¸·Î È¿°úÀûÀ¸·Î À¯ÀúÀÇ À̸ñÀ» ²ø ¼ö ÀÖ½À´Ï´Ù.
Credits: Gal Shir
 
¿©±â¼­´Â º¸Åë Çܹö°Å ¾Ö´Ï¸ÞÀ̼ÇÀÌ °¡Àå ¸¹ÀÌ °í·ÁµÇ´Â ¿É¼ÇÀÏ ÅÙµ¥, ³»ºñ°ÔÀ̼ǿ¡ Ȱ¿ëµÉ ¼ö ÀÖ´Â ¾Ö´Ï¸ÞÀ̼ÇÀº ´ÙÀ½°ú °°ÀÌ ´Ù¾çÇÕ´Ï´Ù.
 
 
Transport between navigational context
µðÀÚÀ̳ʴ ¾Ö´Ï¸ÞÀ̼ÇÀ» Ȱ¿ëÇÏ¿© »ç¿ëÀÚ°¡ ã°í ÀÖ´Â ÄÜÅØ½ºÆ®·Î ¸Å²ô·´°Ô À̵¿Çϵµ·Ï µµ¿ÍÁÖ¸ç, ½ºÅ©¸° »óÀÇ ¿ä¼Ò ¹èÄ¡¿¡ »ý±ä º¯È­¸¦ ¼³¸íÇÕ´Ï´Ù. Àüȯ È¿°ú´Â ¼­·Î ´Ù¸¥ UI »óÅ »çÀÌ¿¡¼­ ´Ù¸® ¿ªÇÒÀ» ÇØÁÜÀ¸·Î, ½ºÅ©¸° »ó¿¡ º¯È­°¡ »ý°åÀ» ¶§ ¾î¶² ÀÏÀÌ ÀϾ°í ÀÖ´Â °ÍÀÎÁö »ç¿ëÀÚ°¡ ÀÌÇØÇÒ ¼ö ÀÖ°Ô ÇØÁà¾ß ÇÕ´Ï´Ù.
 
 
Visual hierarchy and connection between elements
¾Ö´Ï¸ÞÀ̼ÇÀº ÀÎÅÍÆäÀ̽º »óÀÇ ¿ÀºêÁ§Æ®¸¦ Ç¥ÇöÇÏ°í ¿ÀºêÁ§Æ®³¢¸® ¾î¶»°Ô »óÈ£ÀÛ¿ëÇÏ´ÂÁö º¸¿©ÁÖ´Â µ¥ À¯¿ëÇÕ´Ï´Ù. ¾Ö´Ï¸ÞÀ̼ÇÀº ¿ä¼Ò°¡ ¼­·Î ¾î¶»°Ô ¿¬°áµÇ¾î ÀÖ´ÂÁö º¸¿©ÁÝ´Ï´Ù.


Credits: Vitaly Rubtsov
 
 
Function change
¾î¶² °æ¿ì¿¡, µðÀÚÀ̳ʴ ƯÁ¤ Á¶°ÇÇÏ¿¡ ±â´ÉÀûÀ¸·Î º¯È­ÇÏ´Â ¾×¼Ç ¹öưÀ» µðÀÚÀÎÇ϶ó´Â ¿ä±¸¸¦ ¹Þ±âµµ ÇÕ´Ï´Ù. º¸Åë Àü¹ÝÀûÀÎ °ø°£ÀÌ Á¦ÇÑµÈ ¸ð¹ÙÀÏ µðÀÚÀο¡¼­ ¸¹ÀÌ ¹ß°ßÇÒ ¼ö ÀÖ½À´Ï´Ù.


“Àç»ý”°ú “Á¤Áö” ¹öưÀº ´ÙÁß»óÅ ¹öư Áß ¾Æ¸¶ °¡Àå ÈçÇÏ°Ô »ç¿ëµÇ´Â »ç·ÊÀϰÍÀÔ´Ï´Ù.
Credits: KREATIVA Studio
 
ÀÌ·± À¯ÇüÀÇ ¾Ö´Ï¸ÞÀ̼ÇÀº »ç¿ëÀÚ°¡ ±×°ÍÀ» »ç¿ëÇÒ ¶§ ¾î¶»°Ô ¹Ù²î´ÂÁö º¸¿© ÁÝ´Ï´Ù. ¾Æ·¡ »ç·Ê¸¦ º¸¸é, À¯Àú°¡ ÇÃ·ÎÆÃ ¾×¼Ç ¹öư(floating action button)À» ´©¸£¸é Ç÷¯½º ½ÎÀÎÀÌ ¿¬ÇÊ ¸ð¾çÀ¸·Î ¹Ù²ò´Ï´Ù. ¿¬ÇÊÀº °¡Àå ÁÖµÈ ÀÛ¼º ±â´ÉÀ» º¸¿©ÁÖ´Â °Í ÀÔ´Ï´Ù. ÀÌ·¯ÇÑ ÀÛÀº µðÅ×ÀÏÀÌ ‘´ÙÀ½¿¡ ÀϾ ÀÏÀ» ÃßÃøÇØ¾ß¸¸ ÇÏ´Â »óȲ’°ú ‘µÎ »óÅ¿¡¼­ ¾ÆÀÌÄÜÀÌ ¾î¶² ÀǹÌÀÎÁö ÀÌ¹Ì ¾Æ´Â »óȲ’ÀÇ Â÷À̸¦ ¸¸µì´Ï´Ù.
 

¹öưÀº “Ç÷¯½º”¿¡¼­ “¿¬ÇÊ”·Î ¸ð¾çÀÌ ¹Ù²î¸é¼­ ¹öưÀÇ ±â´ÉÀÌ ¹Ù²î¾úÀ½À» º¸¿©ÁÝ´Ï´Ù.
Credits: Material Design
 
 
 
3. Visual Feedback
 
½Ã°¢Àû Çǵå¹éÀº ¾î¶² ÀÎÅÍÆäÀ̽º¿¡¼­µç ¸Å¿ì Áß¿äÇÕ´Ï´Ù. »ç¿ëÀÚ°¡ ÅëÁ¦°¨À» ´À³¥ ¼ö ÀÖ°Ô ÇØÁִµ¥, »ç¿ëÀÚ¿¡°Ô ÅëÁ¦°¨À̶õ ¾ðÁ¦µç ½Ã½ºÅÛÀÇ Çö »óŸ¦ ¾Ë°í ÀÌÇØÇÑ´Ù´Â °ÍÀ» ÀǹÌÇÕ´Ï´Ù.
 
 
Acknowledgement
¹öưÀ̳ª ÄÁÆ®·Ñ °°Àº »ç¿ëÀÚ ÀÎÅÍÆäÀ̽º ¿ä¼Ò´Â À¯¸® µÚ¿¡ Á¸ÀçÇÑ´Ù ÇÒÁö¶óµµ ½ÇÁ¦ À¯ÇüÀÇ ¹°Ã¼·Î º¸ÀÌ°Ô ¸¸µé¾î¾ß ÇÕ´Ï´Ù. ¹°¸®Àû ¼¼°è¿¡¼­ ¾²´Â ¹öưÀ̳ª ÄÁÆ®·Ñ, ±× ¿Ü ´Ù¸¥ ¿ÀºêÁ§Æ®µéÀº ¿ì¸®°¡ ÇØ´ç ¿ÀºêÁ§Æ®¿¡ °¡ÇÏ´Â Çൿ¿¡ ´ëÇÑ ¹ÝÀÀÀ» º¸ÀÔ´Ï´Ù. »ç¶÷µéÀº »ç¿ëÀÚ ÀÎÅÍÆäÀ̽º ÄÁÆ®·Ñ¿¡ ´ëÇØ¼­µµ °°Àº ¼öÁØÀÇ ¹ÝÀÀ¼ºÀ» ±â´ëÇÕ´Ï´Ù. ÀÌ·¯ÇÑ °¸À» ÁÙÀ̱â À§Çؼ­, ÀÎDzÀÌ ¹ß»ýÇÏ´Â Áï½Ã ÀÎÁöÇÏ¿©, ¸¶Ä¡ Á÷Á¢ Á¶ÀÛÇÏ´Â °Íó·³ º¸ÀÌ°í ´À²¸Áöµµ·Ï ½Ã°¢Àû ¸ð¼Ç ´Ü¼­°¡ ¿òÁ÷¿©¾ß ÇÕ´Ï´Ù.
 


À¯ÀúÀÇ ÅÇ¿¡ ¹ÝÀÀÀ» º¸¿©ÁÖ´Â ¹öư
Credits: Material Design
 
 
Visualize the results of the actions
¾Ö´Ï¸ÞÀ̼ÇÀº ÀÎÅÍ·¢¼ÇÀÇ ¸ðµç ÁöÁ¡À» °³¼±ÇØ ÁÙ ¼ö ÀÖÀ¸¸ç »ç¿ëÀÚ°¡ ¼öÇàÇÏ´Â ¾×¼ÇÀ» º¸°­ÇØ ÁÙ ¼ö ÀÖ½À´Ï´Ù. ¾Æ·¡ StripeÀÇ »ç·Ê¸¦ º¸¸é, »ç¿ëÀÚ°¡ “Pay”¸¦ Ŭ¸¯Çϸé, °áÁ¦°¡ ¼º°øÀûÀ¸·Î µÇ¾úÀ½À» º¸¿©ÁÖ±â Àü¿¡ ½ºÇdzʰ¡ Àá±ñ ³ªÅ¸³³´Ï´Ù. üũǥ½Ã ¾Ö´Ï¸ÞÀ̼ÇÀº »ç¿ëÀÚ°¡ ½±°Ô °áÁ¦¸¦ Çß´Ù°í ´À³¢°Ô ÇØÁִµ¥, »ç¿ëÀÚ´Â ÀÌ·± Áß¿äÇÑ µðÅ×ÀÏÀ» ÁÁ¾ÆÇÕ´Ï´Ù.
 

½Ã°¢Àû ¹ÝÀÀÀº ÀΰÔÀÌÁö¸ÕÆ®¸¦ ³ôÀÏ ¼ö ÀÖÀ¸¸ç À¯Àú¸¦ ±â»Ú°Ô ÇØÁÙ ¼ö ÀÖ½À´Ï´Ù.
Imagecredit: Michaël Villar
 
 
 
Conclusion
¾Ö´Ï¸ÞÀ̼ÇÀº Á¤±³ÇÏ°Ô »ç¿ëµÇ¸é °­·ÂÇÑ ÈûÀ» ¹ßÈÖÇÕ´Ï´Ù. ¾î¶² µðÀÚÀο¡µç »ý¸íÀ» ºÒ¾î ³Ö¾îÁÖ¸ç, »ç¿ëÀÚ°¡ ÀÏ»óÀûÀΠŽºÅ©¸¦ ¼öÇàÇÒ ¶§µµ ¸ôÀÔÇÒ ¼ö ÀÖ°Ô ÇØÁÖ¸ç, ´ç¿¬È÷ ¿©·¯ºÐÀÌ ±ºÁß ¼Ó¿¡¼­ ´«¿¡ ¶ç°Ô ¸¸µé¾î ÁÙ °ÍÀÔ´Ï´Ù. Àß µðÀÚÀÎµÈ ¾Ö´Ï¸ÞÀ̼ÇÀº °øµé¿© ¸¸µé¾ú´Ù´Â ´À³¦À» ¹Þ°Ô ÇØÁÝ´Ï´Ù.
 
Posted by kimdirector | 2020.05.25 | Hit : 836
LINK https://uxplanet.org/3-key-uses-for-animation-in-mobile-ui-design-4d7c482dd84b
Tags UX ¸ð¹ÙÀÏ ¾Ö´Ï¸ÞÀÌ¼Ç UI µðÀÚÀÎ
Trackback http://www.kimdirector.co.kr/bbs/zerotb.php?id=DesignInspiration&no=76

COMMENT
¸ñ·Ïº¸±âÀÌÀüº¸±â

¸ð¹ÙÀÏ UI µðÀÚÀÎ ¾Ö´Ï¸ÞÀÌ¼Ç 3°¡Áö ¿øÄ¢
¾Æ·¡ ³»¿ëÀº "3 Key Uses for Animation in Mobile UI Design"ÀÇ ³»¿ëÀ» ¹ø¿ªÇÑ ³»¿ëÀÔ´Ï´Ù. ÀÇ¿ªÀÌ ÀÖÀ» ¼ö ÀÖÀ¸...
NO: 2020.05.25 836 
[ÀÎÆ÷±×·¡ÇÈ »çÀÌÆ® Ãßõ] 50¸¸ ÀåÀÌ ³Ñ´Â ¼Å...
Creative Template with apple banner / can be used for infographics / banners / concept vecto...
NO:62 2015.11.27 6754 (1)
2015 ·Î°í µðÀÚÀÎ Æ®·»µå Top10
Design Bolts—New trends of Logo design for 2015À» ¹ø¿ª ¹× À籸¼ºÇÑ Æ÷½ºÆ®¸¦ ¼Ò°³ÇÕ´Ï´Ù. ¿©·¯ºÐÀÇ ·Î°í µðÀÚ...
NO:61 2015.04.28 9603 
30 Dark iPhone App UI Designs
¸ð¹ÙÀÏ UI µðÀÚÀÎÀº ÇöÀç °£´ÜÇÑ ¹öưÀ̳ª ¶óÀÎ ¾ÆÀÌÄÜ ÆíÆòÇÑ ¿ä¼Ò¿¡ ÃÊÁ¡À» ¸ÂÃß°í ÀÖ½À´Ï´Ù. ±¦ÂúÀº ¾îÇø®ÄÉÀ̼ÇÀÌ ¸¹ÀÌ ÀÖÁö¸¸, UIÀÇ ¿µ°¨À» À§ÇÑ ÃÖ...
NO:60 2015.04.17 5866 
±â¹ßÇϰí âÀÇÀûÀÎ ·Î°í µðÀÚÀÎ 15¼±-ÇÏÀÌÄÁ¼Á,...
±â¹ßÇϰí âÀÇÀûÀÎ ¼¼°èÀÇ ·Î°í µðÀÚÀÎ 15¼±   °¡Àå ´Ü¼ø ½ÉÇà ÇÏÁö¸¸ ¸¹Àº °ÍÀ» ´ã°í ÀÖ¾î¾ß ÇÒ ·Î°í µðÀÚÀÎ ±×·¯ÇÑ ÀÌÀ¯·Î ·Î°í µð...
NO:59 2015.04.10 2998 
´Ù¾çÇÑ ÇüÅÂÀÇ ¸ð¼ÇÀ» ÀÌ¿ëÇÑ µðÀÚÀÎ »ç·Ê
½º¸¶Æ®ÆùÀ» »ç¿ëÇϸ鼭 °¡²û ´À³¢´Â °Íµé Áß¿¡¼­ Àç¹ÌÀÖ´Â È¿°ú ¶Ç´Â ½Å±âÇÑ È¿°úµéÀ» º¼ ¶§¸é ³ªµµ ¸ð¸£°Ô °¨Åº»ç¸¦ ¿¬¹ßÇÒ ¶§°¡ ÀÖ´Ù. ÀÌ·± ´À³¦À» °¡Áú ...
NO:58 2015.03.20 14895 
The 2014 Logo Trend Report
2014³â ¿Ã ÇÑ ÇØµ¿¾È ÀÖ¾ú´ø ´Ù¾çÇÑ ½ºÅ丮µéÀÌ ¿¬¸»¿¡ ¸¹ÀÌ ¼Ú¾ÆÁ® ³ª¿À°í ÀÖ½À´Ï´Ù. IT°èµµ Å©°Ô ´Ù¸£Áö ¾Ê¾Ò½À´Ï´Ù.    2014³â¿¡ ±â...
NO:57 2014.12.26 6324 
È¿°úÀûÀÎ ±â´É¼ºÀ» °®Ãá UI, UX µðÀÚÀÎ »ç·Ê
À¥ ±â¹Ý ÀÀ¿ë ÇÁ·Î±×·¥°ú ¸ð¹ÙÀÏ ¾ÛÀ» µðÀÚÀÎ ÇÒ ¶§, Á¦ÀÏ ¸ÕÀú °í·ÁÇØ¾ß ÇÒ »çÇ×Àº ¾î¶² °ÍµéÀÌ ÀÖÀ»±î¿ä?   ´Ü¼øÈ÷ µðÀÚÀθ¸ °­Á¶ÇÒ °ÍÀÎÁö...
NO:56 2014.12.18 10647 
40 Effective Responsive Naviga...
¾Æ·¡ ¼Ò°³Çϰí ÀÖ´Â »çÀÌÆ®µéÀº ±âº»À¸·Î ¹ÝÀÀÇü À¥ ÇüÅ·ΠµÇ¾î ÀÖ½À´Ï´Ù. PC ¹öÀüÀÎ °æ¿ì¿¡´Â »ó°ü¾øÀÌ ¼­ÇÎÀÌ °¡´ÉÇϰÚÁö¸¸, ¸ð¹ÙÀÏ ¹öÀü¿¡¼­ÀÇ ...
NO:55 2014.12.13 2203 
25 UI design inspiration
¾Æ·¡ ¼Ò°³Çϰí ÀÖ´Â ´ëºÎºÐÀÇ UI µðÀÚÀÎÀº ¾ÖÇø®ÄÉÀÌ¼Ç ¶Ç´Â ¸ð¹ÙÀÏ ¾ÛÀ̳ª À¥ ÆäÀÌÁö¿¡¼­ Ȱ¿ë °¡´ÉÇÑ UI ¿ä¼Òµé ÀÔ´Ï´Ù. °¢Á¾ ¸Þ´º ¾ÆÀÌÄÜ ºÎÅÍ ½½...
NO:54 2014.11.26 3006 
26 Parallax Scrolling Design I...
¿äÁò ºÎ½ Parallax Scrolling¿¡ ´ëÇÑ Æ÷½ºÆÃÀÌ ¸¹Àº °Í °°½À´Ï´Ù. ÇöÀç ¸¹ÀÌ À̽´È­µÇ°í ÀÖ´Â Æ®·»µåÀ̱⵵ ÇÏÁö¸¸ ±×¸¸Å­ °ü½ÉÀ» ¸¹ÀÌ ...
NO:53 2014.11.11 2785 
jQuery ¶óÀ̺귯¸® ±â¹Ý ¹«·á ¿ÀÇ ¼Ò½º Ç÷¯...
¼Ò°³Çϰí ÀÖ´Â Ç÷¯±×ÀÎÀº ÁÖ·Î jQuery ¶óÀ̺귯¸®¸¦ ±â¹ÝÀ¸·Î ¹«·á ¿ÀÇ ¼Ò½ºµéÀÔ´Ï´Ù.  ¿øÇÏ´Â È¿°ú¸¦ ÀçÇöÇϱâ À§ÇØ °£´ÜÇÑ JavaScript ...
NO:52 2014.11.03 4343 
Elements of a Brilliant jQuery...
À¥»çÀÌÆ® Á¦ÀÛ½Ã, Ȱ¿ëµµ°¡ °¡Àå ³ôÀº image slider ¿¡ ´ëÇÑ ÁÁÀº ¸®¼Ò½º ÆÄÀϵéÀ» ¼Ò°³ÇÕ´Ï´Ù. ±× ÀÌÀ¯´Â ¿©·¯°¡Áö°¡ ÀÖ°ÚÁö¸¶ ±× Áß¿¡¼­ ÄÁ...
NO:51 2014.10.31 8227 
Interesting Examples of HTML5 ...
À¥µðÀÚÀ̳ʵ鿡°Ô Áß¿äÇÑ °Ç Æ÷Æ®Æú¸®¿ÀÀÔ´Ï´Ù. ÀÚ½ÅÀÌ ÀÛ¾÷ÇÑ °á°ú¹°À» Á¤¸®Çϱâ À§ÇÑ ¼ö´ÜÀ¸·Î Æ÷Æ®Æú¸®¿À¸¦ °ü¸®Çϱ⵵ ÇÏÁö¸¸ ³»°¡ Á¦ÀÛÇÑ ÀÛ¾÷¹°µé...
NO:50 2014.10.24 2225 
¸ð¹ÙÀÏ ¾Û µðÀÚÀο¡ ÃÖÀûÈ­µÈ UI ±¸Çö »ç·Êµé
¸ð¹ÙÀÏ ÀÎÅÍÆäÀ̽º µðÀÚÀ̳ʵéÀº ¸ð¹ÙÀÏ¿¡ ÃÖÀûÈ­ µÈ »çÀÌÆ®´Â »çÀÌÆ® °³¹ßÀÚÀÇ ºÎ´ãÀ» °¡º±°Ô ÇÒ ¼ö ÀÖÁö¸¸, ÀϺΰ¡ ¾Æ´Ñ Àüü ±â´ÉÀÇ ¾ÛÀ» ±¸ÃàÇÏ°í °³¹ßÇÏ...
NO:49 2014.10.16 10985 

 1 2345
WEBDESK
Webdesign Report
Web Plan Report
Inspiration
Web Development
Recommend Site
Insight Story
Popular Contents
Category Cloud
About us Review Portfolio Design Review Leaders Story Mobile Work IT Information Web Identity Work Everyday Mobile Life Webdesign Web Development Homepage Work Web Plan Report Practical Use Tip Inspiration Download Recommend Site  ETC. Work  Artwork  Typography Work
Tags
Ç÷¡½Ã »ç¿ë·® ȸÀÇ ÀÌÇØ µðÀÚÀÎ ÇÑ±Û ÀÏ·¯½ºÆ® ¾Èµå·ÎÀÌµå ³í¸® µµ¼­ Ŭ¶ó¿ìµå ¾ÆÀÌÆù ¾îµµºñ ȨÆäÀÌÁö ±¸Ãà ÇÁ·ÎÁ§Æ® ±â¼ú ¸¶¿ì½º Á¦¾È¼­ À¥µðÀÚÀÎ ¸ð¹ÙÀÏ µðÀÚÀÎ ÆùÆ® ÀÎÅÍÆäÀ̽º ÇÁ·Î±×·¡¹Ö kimdirector CIP »ï¼ºÀüÀÚ Example UX HTML5 ¼±Åà ¾Öµå¿þ¾î ·Î°í Àü½Ã ¾ÖÇà ÅÂºí¸´ À¥µðÀÚÀÌ³Ê ¿ÀÇÁ¶óÀÎ ºê¶ó¿ìÀú
Recommend Tags
µðÀÚÀÎ ¾ÅÅ· ÆÛ½º³Î ºê·£µå »ç¿ëÀÚ °æÇè ¼­ºñ½º µðÀÚÀÎ