WWWEB/DESIGN32 카뱅 모임 아지트 애니메이션 핸폰에 카카오뱅크 광고 알람이 떠서, 왜 알람이 켜져있지 하고 들어가봤다가 이쁜 컬러의 도형들이 막 변하는 애니메이션이 좀 괜찮아보여서 캡쳐캡쳐~ 저기 다각형의 꼭짓점이 모임통장에 모여있는 사람을 뜻한다라고 의도한 느낌...(뇌피셜 +▽ +ㅋㅋ) 두 명인 경우 하트로 표현한 것이 재밌게 느껴짐~ 카카오뱅크 모임통장 팝업 친구, 연인, 가족, 동호인을 초대합니다! event.kakaobank.com 근데, 당연히 SVG 애니겠거니 하고 보니 video였.. (안 봐도 비디오였어야 했는데...) 그래서 코드펜에서 비슷한 것을 찾아봄~~ 나중에 비슷하게 따라해봐야겠음. Square-Triangle-Circle--svg only animation The first three are just references .. 2023. 5. 23. 많이 커진 네이버가 어색할 때 예고한대로 네이버 PC 디자인이 1280 사이즈로 커졌음~ 두둥~ 화면이 커진만큼 폰트도 커지고, 구성 요소들도 커져서 시원해보이는 측면도 있지만, 한편으로 눈이 기존 사이즈에 적응되어 있어서 그런지 아니면 다른 메뉴들이 아직 개편 전이라 그런지 아직은 화면이 어색해보이고, 한 눈에 들어오지 않는 단점이 보이는 것 같음. 집에 있는 4K 모니터로 보면 좋은데, 아직 22인치 사무실 모니터에서는 너무 커보이고, 맥북에선 화면이 잘려서 스크롤이 생기는 불편함이.... ㅠ 이럴 때 쓰는 꿀팁이 있으니 그것은 CTRL+마우스휠로 화면을 줄여서 보는 것! =￣ω￣= 예쓰~예쓰~예쓰~ CTRL을 누른 상태에서 마우스휠은 내리거나, 또는 CTRL을 누른 상태에서 -키(마이너스키)를 누르면 보기 편안한 상태가 됨~ ㅎ.. 2023. 5. 18. 새로운 네이버의 NEXT 메인 국내 웹 디자인 시장을 선도(...아마도?)하는 네이버 메인 디자인이 나왔다~ 어떤 부분이 변경되었나 살펴보니.... 1. 모바일과 연속된 사용자 경험 강화. (뉴스, 관심사, 쇼핑 등) 2. 작은창 위젯으로 열어 쓸 수 있는 '위젯 보드' 추가 (캘린더, 메모, 파파고, 영어사전, NOW 등) 3. '바로가기' 및 '알림/혜택' PC 메인 우측 상단 위치 4. 날씨, 증시 개별 보드로 한 눈에 확인 5. '글자 크기' 설정 기능 제공 6. 라이트/다크 모드 기기 설정값과 연동 7. 해상도가 2560 이상인 경우 3단 레이아웃 등 반응형디자인 제공 즉, 화면만 이쁘게 바뀐 것이 아니라 UX에 대해서도 신경을 많이 쓴 흔적이 보이는 것 같다. 새로운 모습의 네이버 PC 메인을 만나보세요. 3년 만에 개편되.. 2023. 5. 10. [UI/UX] gent.midea (패럴럭스, SVG, canvas 등) https://www.gent.media/ 사이트를 보고, 다양하게 참고해볼만한 것들이 많아 이러저리 살펴봄. ABOUT - 타이틀인 "award-winningdesigner/creativedeveloper" 글자는 각 글자를 태그로 감싸서 animation-delay를 이용. - 나머지 작은 글자들을 모두 으로 감싸기는 어려우니 아래에서 위로 올라오는 모션을 줌. - GENT - about 페이지와 동이한 타이포 애니메이션. - 스크롤다운 아이콘 효과. - canvas로 구현한 우주 효과... 아마도 three.js인 듯 - 스크롤을 없애고, 페이지 길이를 오른쪽 bar로 줌. - 포폴사이트들의 패럴럭스 효과가 괜춘~ 2023. 5. 4. [벤치마킹] 금호타이어, SK C&C, 넥슨, 토요타 등 디자인 금호타이어 (http://www.kumhotire.co.kr/kor/main/main.asp) ...... SK C&C (http://www.skcc.co.kr/) ...... 넥슨 (http://www.nexon.com/home/game.aspx) ...... 토요타 (http://www.toyota.co.kr/contents/index.asp) 2013. 5. 28. [벤치마킹] 현대케피코, EXR, 우리은행, 서울컨벤션 등 디자인 현대케피코 (http://www.hyundai-kefico.com/ko/main/main/index.do) ...... EXR KOREA (http://www.exrkorea.com/main.asp) ...... 우리은행 (https://www.wooribank.com/) ...... 서울컨벤션 (http://www.seoul-convention.co.kr/sub/service.php) 2013. 5. 28. [벤치마킹] 삼성카메라, 이숨, 아모레퍼시픽, 포스코, GS엠비즈 등 디자인 삼성 스마트 카메라 (http://www.samsung.com/sec/smartcamera/) : GNB ...... 이숨 (http://www.e-soom.co.kr) : 워드프레스 기반 반응형 웹 ...... 아모레퍼시픽 (http://makeupyourlife.amorepacific.com/index.do) : 그리드 레이아웃 ...... 포스코 (http://www.posco.co.kr/homepage/docs/kor3/jsp/s91a0000001i.jsp) : 메인의 구석구석 아기자기한 애니메이션 ...... GS엠비즈 (http://www.gsmbiz.com/) : 메인비주얼 애니메이션, gnb전체메뉴, 색감, 배너부분 넘버링 2013. 5. 21. [벤치마킹] ezpub, 하나은행, 셀바스 등 디자인 ezpub (http://ezpub.co.kr/html/main/main.php) : 메인 느낌 좋다 ... 하나은행 (http://www.hanafn.com/main.do) : GNB 구성, path, 등 ... 셀바스 (http://www.selvas.com/) : 메인 슬라이딩, 셀렉트 레이어 2013. 3. 19. [벤치마킹] 이패스씨앤아이 디자인 이패스씨앤아이 (http://epasscni.com/) : 디자인 괜찮고, 반응형웹(RWD) 등 ... 2013. 3. 14. 이전1 1 2 3 4 다음 728x90 반응형
