본문 바로가기

반응형

web design

(17)
[html/css]웹페이지에서 파비콘 가져오기 / 파비콘 연결하기 / 파비콘 만들기 및 아이콘 파일로 변경하기 파비콘 Favicon : 즐겨찾기할 때 추가되는 아이콘 모양 일반적으로 디자이너가 포토샵으로 직접 만들때는 16px X 16px 으로 작성하여 파일명.png 로 저장하여 아이콘(.ico) 파일로 변경합니다. png 파일을 ico 파일로 변환하기 아이콘 파일로 변경해 주는 사이트 ▼http://favicon-generator.orgFavicon & App Icon GeneratorUpload an image (PNG to ICO, JPG to ICO, GIF to ICO) and convert it to a Windows favicon (.ico) and App Icons. Learn more about favicons.www.favicon-generator.orghttp://www.degraeve.com..
[일러스트레이터] 이미지 고정 / 고정 해제하기 이미지 고정 단축키 다중의 레이어 위에서 계속 작업을 해야하거나, 드래그/ 선택할 부분이 많을 경우 배경이나 뒤에 있는 이미지가 같이 잡히거나 움직이면 작업하기 불편합니다.이러한 경우에 원하는 이미지를 선택하여 부분적으로 레이어 위에서 안 움직이도록 고정할 수 있습니다.이미지 이외에 텍스트, 도형도 고정 가능합니다. 모작하면서 연습할 때에 활용하면 좋아요 이미지 고정하기이미지 클릭 > Ctrl+2 이미지 고정 해제하기Ctrl+ Alt +2
[웹디자인] index, route map ui 목차 / 노선도 디자인
[웹디자인] location icon design download - 위치표시 아이콘 / 위치 아이콘 연습용으로 만들어 본 지도에서 자주 사용하는 위치표시 아이콘입니다 사용은 자유입니다
[웹디자인] graph icon design download - 그래프 아이콘 / 차트 아이콘 일러스트레이터로 그래프 아이콘 만들기!
[웹디자인 포트폴리오] Bershka 웹페이지 리뉴얼하기 - 1920px/1600그리드로 pc화면 설계하기 spa 브랜드 bershka는 컨텐츠 단순한 2-1-2-1 나열로만 이루여져 있습니다개인적으로 큰 이미지들로 메인페이지를 구성하는 건 내 스타일이기도하고 하이브랜드인 샤넬, 구찌도 이러한 레이아웃을 추구하고 있어서 딱히 마음에 안드는건 아니지만 화면 로딩시간도 길고 페이지넘김에 무거운 느낌이 있습니다. 작성 요건에 맞추어서 디자인한 결과입니다.2) 문서 필수 작성 사항① 매체별 특성 PC에 맞는 화면 그리드를 작성하여 작업을 진행한다.- PC화면 : 문서 크기(1920), 그리드(1600grid, 그리드 폴더명(1600그리드))② 설계단계에서 진행한 폰트와 컬러를 사용하여 작성한다.③ 메인메뉴로 배치하지 않을 별도의 아이콘 및 메뉴를 탑메뉴로 설정하여 작성하시오.(자주 사용하는 요소는 아니지만 필요한 요..
[웹디자인 포트폴리오] PANDORA Website renewal project > 3. 판도라 웹사이트 반응형으로 시안 만들기 - 그리드 사이 PC 기준으로 웹페이지 전체 사이즈와 그리드 - 1920px에 1200px pc화면을 기준으로 디자인할 경우에는 화면의 전체 사이즈를 1920px로 잡고 가운데를 기준으로 1200px로 설정해서 칼럼과 거터를 정하는게 가장 일반적이다. 계산하기 귀찮을 때에는 칼럼 70px에 거터 30px로 정한 후 양 끝 거터를 15px로 맞추는 형식으로 진행하지만 원하는 UI 디자인의 정확한 사이즈가 있다면 https://1200px.com/ 에서 직접 입력하면 쉽게 칼럼과 거터의 px사이즈를 알 수 있다. 1200px Grid System Why 1200? All modern monitors (mostly wide-screen) support at least 1280 x 1024 pixel resolution. In..
[웹디자인 포트폴리오] PANDORA Website renewal project > 1. 판도라 상세 제품/브랜드 스토리 페이지 내맘대로 디자인 해외취업을 위한 영문 웹페이지 시안 디자인하기 일본 SE나 웹디자이너 직무에 지원하고 싶어 서브페이지부터는 영문으로 시안을 만들었다. 마침 디즈니랑 콜라보를 하고 있어서 특색 있는 컬렉션 페이지를 디자인했다. 제품 자체도 크기를 너무 작게 올렸는데 비해 일본이나 영국 판도라 사이트를 보니 이미지컷을 확대해서 업로드하여 디테일을 더욱 상세히 볼 수 있는 장점이 있었다. 베너와 콜라보 이미지를 만들기 위해 공을 많이 들였는데 기대 이상으로 잘 뽑힌 것 같다. 2-3년 전부터 디즈니나 워너브라더스 등과 콜라보레이션을 진행하는 브랜드가 부쩍 증가하였지만 그에 비해 주얼리 디자인은 어떤 브랜드와 콜라보했는지 잘 나타나지 않는 마케팅의 미흡한 점을 보충하기 위해 오리지널 이미지를 사용하였으며, 엄청난 포부를 가지고..

반응형