본문 바로가기

디자인18

반응형 웹 디자인을 위한 디바이스별 스크린 사이즈 반응형 웹디자인을 하던 중 사이즈 기준이 헷갈려서 구글링을 하다가 아주 유용한 사이트를 발견했어요 ​ http://screensiz.es/ Screen Sizes | Viewport Sizes and Pixel Densities for Popular Devices screensiz.es Screen Sizes 에서 현존하는 스마트폰, 테블릿, 데스크탑의 크기를 한번에 확인하실 수 있어서 정말 편하더라구요 ​ 최상단 아이콘을 누르기만 하면 모든 사이즈를 다 알수있다니.. 이제 반응형 웹 디자인할 때 사이즈로 헷갈리지 않을 수 있겠어요. ​ 그럼, 모두 편하고 즐거운 웹 디자인 되세요~ 2023. 10. 5.
효율적인 디자인 업무방법(경험을 바탕으로 작성) 인쇄파일 관리 ​ 작업 1개당 - 파일 2개 보관 ​ 글자 깬 파일 인쇄소에 넘겨줄 때 글씨를 깨서 줘야한다 글자 깨지않은 파일 수정사항이 생겼을 때 바로 수정 가능한 파일 영상파일 관리 ​ 원본 파일 관리는 필수! ​ 수정사항이 생겼을 때 바로 수정 가능한 파일 용량이 크다면 구글 드라이브나 USB에 넣어두도록 무심코 지웠다가 더 개고생하는 경우가 생길 수 있다! ​ 레이어 정리 연습 ​ 단체작업 = 레이어 별 정리 ​ 일러스트레이터나 스케치 파일을 작업할 때 레이어별로 구분하는게 단체작업에서 이쁨받는 팁! ​ 항상 작업시 이름지정과 항목구분을 잘해놓자 미래의 나 나중에 정리하느라 쓰는 시간을 절약할 수 있게 2023. 10. 5.
[디자인 꿀팁] 신입 디자이너라면 꼭 알아야 할 무료 폰트 2 안녕하세요! 타이틀 폰트로 디자인 퀄리티가 크게 좌우되곤 하는데요 오늘은 타이틀로 쓰면 좋을 저작권 무료 폰트 5가지를 들고왔습니다~ 신입 디자이너였을 때 알았으면 참 좋았을걸 생각하는 폰트들 추천 시작합니다! 1. 평창평화체 https://www.pc.go.kr/portal/intro/intro-summary/pcFont 평창군입니다. 평창행정 www.pc.go.kr 2. 창원단감아삭체 가독성도 좋고 부드러워서 한글이던 영어던 사용하기 참 좋았어요 https://www.changwon.go.kr/depart/contents.do?mId=1006160000 창원단감서체 | 농업기술센터 | 농업/환경 | 창원시 분야별 정보 www.changwon.go.kr 3. 이누아리두리네 모서리 부분이 동그랗고 폰트의.. 2023. 9. 20.
[디자인꿀팁] Web, App UI 여백 사용 꿀팁 럭셔리한 디자인의 비결 : 여백 여백을 잘 사용한 디자인은 가독성이 좋기 뿐만 아니라 럭셔리함을 느끼게 한다. 그래서 대기업의 홈페이지나 고급화장품의 브로슈어 디자인 같은 경우 화려하지 않은데 압도감을 느끼게 하는 디자인이 많다. 그들의 공통점은 여백을 적절하게 또는 과하게 사용했다는 것이다. 별 것 넣지 않아도 느낌있게 적절히 여백을 사용을 할 수 있는 능력이 진짜 디자인 고수라고 느낀다. https://www.youtube.com/watch?v=YNDhbNQo_io 디자이너의 디자이너이신 마디아님 께서 올려주신 실무 여백 특강을 분석해보자! 여백이란? 각각 오브젝트 사이의 공간 값을 말하며 중요한 디자인 요소 중 하나이다. 여백의 역할 집중해야 할 곳을 알려준다. 시선 분산을 막아준다. 여백을 활용한.. 2023. 9. 1.
[디자인꿀팁] 무료 아이콘 사이트 모음 작업시간을 단축시키는 무료 아이콘 사이트 모음 아이콘은 아주 작은 요소지만 작은 디테일로 디자인의 분위기를 좌우하기 때문에 작업물의 퀄리티에 큰 영향을 끼친다고 생각한다. 그렇기 때문에 디자이너들은 양질의 아이콘만 사용해도 작업 시간에 반비례한 디자인 퀄리티를 얻을 수 있다. 여기 시간 없는 디자이너를 위해 아이콘 작업 시간을 단축시켜주는 무료 아이콘 사이트들이 있다. 1. Remixicon 자주 사용하는 아이콘 사이트. 업데이트가 자주 되고 있는 편이다. https://remixicon.com/ Remix Icon - Open source icon library remixicon.com 2. Fontawesome 유료, 무료 아이콘이 있다. 개발시 사용하기 편하게 코드도 제공한다. Pro버전은 무료버전.. 2022. 7. 22.
[디자인 스터디] 2022년 UX/UI디자인 트렌드 2022년의 해가 떴으니 새로워질 디자인 트렌드를 공부하자! 올해도 디자이너들 화이팅! 요즘IT > 디자인 > 2022년 UX/UI 디자인 트렌드 from.요즘IT의 번역글들 2022년 UX/UI 디자인 트렌드 | 요즘IT 2022년에는 어떤 디자인이 유망할지 알아볼 시간입니다. 새로운 기술과 트렌드가 익숙한 표준이 되기 전에 미리 유망한 디자인을 예측해서 한 발 앞서 나가는 디자이너가 되어봅시다. 자, 그럼 yozm.wishket.com 이제 당연한 것으로 자리잡은 트렌드 다크모드 3D 일러스트레이션 - Spline 디자인 시스템 글래스모피즘 2022 UX/UI 디자인 예측하기 가상현실(Virtual Reality)/혼합현실(Mixed Reality) 노 코드(No Code) - webflow 모바일 .. 2022. 1. 6.
[디자인꿀팁] UXUI 스터디 사이트 모음 1. 요즘IT - 프로덕트 IT전반적인 이야기를 들을 수 있다. 각 회사의 내노라는 전문가들이 모여 각자의 지식을 공유하는 플랫폼이다. 디자인 뿐 아니라 기획, 개발, 프로덕트 등 최신 이야기를 접할 수 있다. https://yozm.wishket.com/magazine/list/product/ IT 프로덕트 이야기들 | 요즘IT 요즘 IT 이야기가 가득한 요즘IT yozm.wishket.com 2. 디자인나침반 디자인 프로덕트를 중심으로 스터디 할 수 있는 블로그다. 디자인 관련 뉴스, UX, UI, 프로덕트 등 양질의 정보를 얻을 수 있다. 뉴스레터 구독하면 메일로 컨텐츠를 보내준다. 메일 확인할 때마다 디자인 세포를 건드릴 수 있어 구독해두면 좋다. https://designcompass.org/ .. 2022. 1. 5.
[디자인 스터디] UX Writing 의 정의를 접하다 디자인 나침반으로 부터 메일 한 통을 받았다. UX를 위한 글쓰기라는 타이틀이 메력적이라 클릭해보았는데 내용이 알차고 재미있었다. 지금껏 느껴온 불편을 문장으로 정의내려 주었다. UX 글쓰기는 고객과 제품의 '대화'를 디자인한다는 정의가 굉장히 인상깊었다. 사용자가 원하는 답을 짧고 빠르게 알려주는 것. 인터페이스에서 글쓰기는 사용자와 관계를 맺는 것에 중요한 역할을 하기 때문에 장황하지 않고 쉽고 간결하게 대답해주는 것. 간결하고 명확한 UX글쓰기를 적용하지 못했던 것은 혹시나 모를 사용자의 실수를 방지하기 위해 설명을 덛붙혔기 때문이었다. 설명을 위한 욕심을 버리고 좀 더 간결하게 덜어낸다면 좋은 UX 글쓰기를 할 수 있을 것이다. https://brunch.co.kr/@blckschrl/103 UX.. 2022. 1. 5.
[디자인꿀팁] 무료 이미지 사이트 모음 1. Unsplash Sketch와 Figma등 디자인 툴에 플러그인이 잘 되어있는 이미지 사이트로 세련되고 화질 좋은 높은 퀄리티의 사진들을 구할 수 있다. https://unsplash.com/ 아름다운 무료 이미지 및 사진 | Unsplash 어떤 프로젝트를 위해서든 다운로드 및 사용할 수 있는 아름다운 무료 이미지 및 사진입니다. 어떤 로열티 프리 또는 스톡 사진보다 좋습니다. unsplash.com 2. pxhere 유료, 무료 이미지가 함께 있는 곳으로 Unsplash사이트에서 찾을 수 없는 이미지가 있으면 찾아보는 편이다. https://pxhere.com/ 이미지 검색 & 무료 이미지 - PxHere pxhere.com 3. Gratisography https://gratisography... 2021. 11. 5.
[Flutter] 로또어플 만들기 - 버튼 클릭 시 활성화/비활성화 설정하기 고정수, 제외수 선택 후 로또번호 뽑기 로또윙 어플리케이션에서 랜덤뽑기 방식으로 고정수와 제외수를 선택하려 한다. 고정수와 제외수란 로또번호 선택 시 꼭 넣고 싶은 수를 고정수라고 하고, 제외하고 싶은 수를 제외수라고 한다. 각각 원하는 숫자의 버튼을 선택한 후 포함, 불포함을 설정해야 한다. 랜덤뽑기 순서는 고정수 선택 > 제외수 선택 > 랜덤뽑기 이다. 번호가 중복 되지 않게 하기 위해 고정수 최대 5개 선택 후 제외수 선택 시 고정수가 화면에 표시되도록 했다. 고정수는 사용자가 원하는 숫자앱이기 때문에 로또윙 메인 컬러로 표현을 하여 긍정적인 느낌을 주려 하였고, 제외수는 피하고 싶은 숫자이기에 파랑과 대비되는 빨강으로 표현하여 컬러로 이미지의 구분을 두었다. 🍎 코드로 구현해보자 0. Slive .. 2021. 9. 15.
[디자인꿀팁] 꼭 써야 할 Figma 플러그인 Top3 Rename it 다량의 컴포넌트 이름을 한번에 바꿀 수 있는 플러그인. https://www.figma.com/community/plugin/731271836271143349/Rename-It Figma - Rename It | Keep your Figma files organized, batch rename layers and frames. • Mutiple Layers Rename Multipl... Figma Community plugin — Keep your Figma files organized, batch rename layers and frames. • Mutiple Layers Rename Multiple layers at once. • Sequence Sequentially rename.. 2021. 7. 16.
[디자인꿀팁] 벤치마킹 사이트 모음 1. Behance 세련된 디자인이 거의 다 모여있다고 볼 수 있는 유명한 사이트. 해외의 작품들을 쉽게 볼 수 있다는 장점이 있다. https://www.behance.net/ 최고의 Behance 오늘의 큐레이터 추천 프로젝트 www.behance.net 2. Dribbble 퀄리티 높은 UXUI 디자인 작업물을 접할 수 있는 사이트. 색상을 사용하는 방법이나 아이콘과 로고 등 통일감 있는 디자인 작업 시 참고. dribbble.com/ Dribbble - Discover the World’s Top Designers & Creative Professionals Discover the world’s top designers & creatives Dribbble is the leading destina.. 2020. 5. 22.
맥 단축키 https://knulab.com/archives/9733 맥 사용자가 알아야 할 9가지 단축키 – KNULAB Mac 단축키는 Apple 컴퓨터에서 사용하면 보다 복잡한 일련의 작업들이 한결 수월해지는 키 조합이다. 모든 컴퓨터 작업 (복사, 붙여넣기, 잘라내기 등)에 필수적인 기본 단축키와 함께 디자인 프로세스를 간소화하는 간단하고 실용적인 방법이다. 01. 창 닫기/Close window (Command + W) 많은 다른 문서를 동시에 작업 할 때 상단 모서리의 빨간색 점을 클릭하는 대신 Cmd + W 바로 가기를 사용하여 원치 않는 창을 제거하는 것이 시 knulab.com 2020. 2. 19.
[디자인꿀팁] 무료 목업 사이트 모음 직접 쓰려고 모아둔 유용한 UI 목업 사이트 모음 01. Free Mock Up 디바이스 종류별로 목업들이 있어 가장 활용성이 높은 사이트다. 인쇄물, 제품 목업들도 다수 있다. https://www.free-mockup.com/ Free Mockup | Best free Mockups We collect the best free mockups in one place. Free for personal and commercial use. It's very convenient, join us. www.free-mockup.com 02. anthony boyd graphics 퀄리티가 높고 깔끔하다. 개성이 강한 목업이 많아 구경하는 재미가 있다. https://www.anthonyboyd.graphics/m.. 2020. 2. 12.
[디자인꿀팁] 신입 디자이너라면 꼭 알아야 할 무료 폰트 1 저작권 무료 사이트 내용 https://fonts.google.com/ Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com https://brunch.co.kr/@jade/203 저작권 걱정없는 무료 한글폰트 한글날 기념 무료 한글 글꼴 포함 | 이제 매년 한글날이 되면 많은 기업들이 한글폰트를 내는 것이 좋은 홍보의 수단이 되는 듯 하다. 최근에 누구나 이용할 수 있도록 공개된 무료 한글 공개 폰트(글꼴)들을 정리해 보았다. 유료가 아니어도 예쁜 폰트가 참 많아졌다. 1. 네이버 나눔한글폰트 http://hangeul.naver.com/2016/nanum 가장 많이 사용하는 .. 2020. 2. 12.
[디자인꿀팁] 시간 없을 때 쓰는 PPT 참고/구매 사이트 01. 피피티모아 https://pptmoa.com/ 무료 PPT템플릿 사이트 - 피피티모아 최저가 1000원! 무료 PPT템플릿, 눈에 확 띄는 고품질 세련된 PPT템플릿 배경, 아이콘, 그래프, 차트, 피피티모아 pptmoa.com 참고할 만한 세련된 디자인이 많고 무료 템플릿도 있어 디자인 작업 시 유용하다. 추가+) 디자이너가 꼭 알아야 할 디자인 꿀팁들 https://develop-designer.tistory.com/62 [디자인꿀팁] 무료 아이콘 사이트 모음 작업시간을 단축시키는 무료 아이콘 사이트 모음 아이콘은 아주 작은 요소지만 작은 디테일로 디자인의 분위기를 좌우하기 때문에 작업물의 퀄리티에 큰 영향을 끼친다고 생각한다. 그렇기 때 develop-designer.tistory.com h.. 2020. 1. 9.
[디자인꿀팁] 빠른 UI 작업을 위한 테마 제공 사이트 material.io https://material.io/ Homepage Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences. material.io UI에 컬러를 미리 입혀보고 코드까지 다운받을 수 있다. https://material.io/resources/color/#!/?view.left=0&view.right=0&primary.color=5aa4de&secondary.color=FFC107&primary.text.color=000000 Color Tool - .. 2019. 8. 30.
[디자인 스터디] 노동력을 최대한 줄일 수 있는 스케치 심볼 심볼 툴을 이용하면 다른 페이지에 있는 버튼이나 라인등을 한꺼번에 변경 할 수 있기 때문에 반복 노동 작업을 피할 수 있다. 01. 반복 레이아웃 심볼 등록하기 중복되는 레이아웃 작업을 할 때 작업 처음부터 심볼 등록을 해놓으면 작업 후반부에 전체적으로 변경이 필요한 작업이 생겨도 심볼 하나만 변경하면 공통적으로 적용된 심볼 전체 변경이 가능하다. 시간이 금인 디자이너에게 최적의 툴. 02. 이해를 돕는 강의 https://www.youtube.com/watch?v=yT7LcF5M01A 심볼 툴을 이해하기 좋은 강의:) 03. 심볼 사용 메뉴얼 https://p-j-m.github.io/symbol.html [번역] 스케치 사용자 매뉴얼 - 심볼 심볼 심볼은 아트보드, 페이지와 여러 문서에서 쉽게 요소를.. 2019. 8. 27.
반응형