IT/디자인(Design)29 [피그마]지운 파일 복구, 오너변경 오너변경하기전 꼭 해야 하는 부분은 상단 파일 메뉴->Save As.fig 를 눌러 데스크탑에 최종 원본 파일을 저장한다. 향 후 오너 변경으로 문제가 생겼을때 이미지속 맨 우측 Import file 부분을 클릭 후 저장한 파일을 불러오면 원본파일 복구가 가능하다. 오너 변경하는법 우측 상단 share 버튼 클릭시 팝업이 뜬다. 오너로 설정할 대상을 클릭 후 owner로 변경 지운 파일 복구 방법 피그마 작업중 파일이 삭제 되었다면 왼쪽메뉴 Drafts-> Deleted->Restore 클릭시 복구가 가능하다. 복구 요청 메일을 보낼시 피그마에서 실제로 오는 아래 메일 내용~! 2023. 2. 23. [안드로이드] 아이콘 구글 아이콘 소스 https://fonts.google.com/icons Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 편리하고 빠르게 기본 아이콘을 사용하고 싶다면 구글 아이콘을 사용하면 편리하다 원하는 아이콘을 검색하면 각 웹/안드로이드/ iOS/Flutter로 다운로드가 가능하고 svg로도 다운로드가 가능하여 작업하기 편리하다 각 소스 코드 확인도 가능하다. 안드로이드 사이즈에 최적화된 아이콘 사이즈로 되어있어 안드로이드 디자인시 굉장히 편리하다. 2021. 7. 31. [안드로이드] 디자인 가이드 샘플 소스 안드로이드 기본 디자인 샘플(리소스) 안드로이드 앱디자인시 안드로이드 디자인 리소스 화면에서 -> sketch App prototype을 받아 사용하면 기본 상단 타이틀 및 텍스트 크기등 기본적인 셋팅사항을 참고하여 디자인하면 편리하다. https://material.io/resources Material Design 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 2021. 7. 31. [스케치]스케치 시안 확대 시 깨져보이는 현상 스케치 시안 확대 시 깨져보이는 경우가 있다. 200%로 확대시 시안이나 아이콘이 깨져보인다면~ 우측 상단의 시안 퍼센트 표시 부분을 클릭하면 하단 메뉴들이 나온다. 그 중 show pixels on zoom 이 체크되어 있는데 클릭하여 체크를 해지하면 확대해도 깨지지 않는 시안을 확인 할 수 있다. 아이콘이 흐릿하게 보였지만 400%로 확대해도 깨져보이지 않는다! 2021. 2. 1. [iOS]시스템 폰트 앱 작업시... 자신이 원하는 폰트를 사용해도 되지만 앱의 무게나 속도를 위하여 시스템 폰트를 사용하는 것이 가장 좋다. iOS 시스템 폰트는 SFPro 폰트를 사용한다. 디자이너가 시안을 진행할 때 영문폰트로는 SFPro 폰트로 시안을 진행하면 좋다. 영문 세리프 서체로는 New York SF 폰트를 사용한다. 한글폰트로는 AppleSDGothic을 사용한다. iOS의 폰트는 동적 유형으로 독자가 선호하는 텍스트 크기를 선택할 수 있도록 하여 추가적인 유연성을 제공한다. 시안을 진행할 때는 하단 Large(Default) 텍스트를 기준으로 사용하면 된다. 아래 이미지는 AppleSDGothic 으로 직접 만든 한글 가이드이다. 평소에 사용할 텍스트를 정리해서 제플린에 공유 해놓거나 제플린내 styleg.. 2020. 12. 24. [안드로이드] 시스템 폰트 앱 작업시... 자신이 원하는 폰트를 사용해도 되지만 앱의 무게나 속도를 위하여 시스템 폰트를 사용하는 것이 가장 좋다. 안드로이드 시스템 폰트는 ROBOTO 폰트를 사용한다. 디자이너가 시안을 진행할때 ROBOTO 폰트로 시안을 진행하면 좋다. 하지만 우리는 한국인~! 한글 폰트로 시안을 만들 때가 많다. 한글 폰트로는 DroidSans, NotoSans를 사용하면 된다. 최근에는 NotoSans를 많이 사용하는 추세라~ 주로 NotoSans로 시안 작업을 하는 것이 좋다. 또한 안드로이드에서는 큰 텍스트 블록과 14sp 미만의 텍스트에는 기본 시스템 서체를 사용해야한다. 아래 안드로이드 텍스트 가이드를 참고하여 각 상황에 맞는 폰트 크기를 사용하면 편리하다. 아래 사이트에서 더 자세한 설명과 ROBO.. 2020. 11. 25. [무료 일러스트] 사이트 무료 일러스트 사이트 freewebillustrations.com/ Free Web Illustrations – 1,500+ Beautiful Free Illustrations for Your Website A curated collection of free beautiful and customizable illustrations for use in your commercial and non-commercial web projects. freewebillustrations.com 여러가지 일러스트가 많이 있어서 좋다. 보통 무료이지만 사용할 경우 링크 주소를 기재 해야하는 경우가 많다. 2020. 11. 24. [무료폰트]네이버 나눔손글씨 글꼴 무료폰트라고 하면 네이버의 나눔폰트가 유명하다! 요즘 드라마 스타트업을 재미있게 보고 있는데 원인재의 인재컴퍼니의 폰트 시스템이 참 좋구나 생각하고 있을 쯤~~ 아래 사이트 발견 역시 네이버는 이런 서비스를 진행 하고 있었구나! 내가 뒷북일지도... 실제 사람의 손글씨를 기술을 이용 해 이미 컴퓨터 폰트로 폰트화하는 작업을 하고 있었다. 서비스 설명 OCR 및 이미지 생성 기술을 통해, 단 256자만으로 내 손글씨 고유의 특징을 살려낸 자연스러운 11,172자의 글꼴이 탄생합니다. clova.ai/handwriting 새로운 나눔손글씨 글꼴 - 네이버 클로바 한글한글 아름답게 캠페인과 함께합니다. clova.ai 예쁜 글씨체를 아직까지는 무료로 받을 수 있어서 좋다! 위의 사이트로 가면 원하는 폰트를 테.. 2020. 11. 16. [제플린]zeplin -각각의 이미지 스케치에서 제플린으로 내보내는 방법 원하는 이미지를 선택 (이미지 파일명은 중요하므로 중복 되지 않게 잘 입력한다.) 우측 메뉴에서 MAKE EXPORTABLE 버튼 클릭 클릭 후 빨간색 네모 부분을 클릭하면 모바일 기종을 선택 할 수 있다. (iOS, Android) iOS 선택 후 Export Selected를 버튼을 선택하여 추출 되는 이미지를 저장할 수 있다. 이렇게 추출 된 이미지를 저장 된 폴더 압축 후 이미지를 개발쪽에 보내줘도 되지만 제플린상에서 바로 다운로드 가능하게 하고 싶다면 위의 과정을 거친 후 제플린에 해당 시안을 공유하면된다. 제플린 화면에 공유하면 우측 빨간 박스 부분 처럼 자동으로 iOS 이미지 형태로 다운로드 가능하도록 생성이 된다. 스케치에서는 제플린에 공유하기 위해 한번 이미지를 내보내고 저장하는 방법을 .. 2020. 10. 16. [제플린]zeplin -각각의 이미지 포토샵에서 제플린으로 내보내는 방법 포토샵에서 제플린을 내보내기 위해서는 작업 전 새로만들기 문서에서 "아트보드"를 체크 후 새 문서를 만들어야한다. 만약 그림속 페이스북 버튼을 내보내고 싶다면.. 페이스북 버튼 레이어를 클릭한다. - 레이어명이 곧 이미지명이 되기 때문에 잘 정리해 놓아야 한다. 내보내고 싶은 이미지를 클릭 후 제플린 창에서 mark as asset 버튼을 누른다. mark as asset 버튼 누른 이미지는 파일명 앞에 -e-가 붙는다. Export selected artboard to Zeplin을 클릭하면 제플린 상에 이미지가 생성된다. 내보낸 관련 이미지를 제플린 화면상에서 클릭하면 우측 상단 Assets란에서 이미지를 확인 할 수 있다. 모바일 이미지는 png를 다운받아서 사용하면 된다. ( 각 hdpi/mdpi.. 2020. 6. 30. [font Awesome] 스케치(sketch) 텍스트 기반 아이콘으로 편리하게 아이콘 작업하기 폰트 어썸 사이트에서 폰트를 다운 받아 설치하면 고유 텍스트를 통해 텍스트를 아이콘화 할 수 있다. 와이어프레임 작업시 편리하다. https://fontawesome.com/ Font Awesome fontawesome.com font awesome 사이트로 접속하여 start for free 버튼을 선택한다. 스케치에서 사용할 아이콘이 필요하므로 스케치 버튼을 클릭하여 최종 설치하면 된다. 맥화면에서 서체설치를 통해 폰트를 설치하여 사용할 수 있다. 와이어프레임 작업 중 하단 이미지 안에 user 모양의 아이콘을 넣고 싶다면 영문으로 user로 입력하고 오른쪽 텍스트 선택 부분에서 font Awesome체를 선택하면 유저 아이콘으로 변경이 된다. 와이어프레임을 만들때 급하게 아이콘이 필요할 때 적용하기.. 2020. 4. 10. [APPLE]Human Interface Guidelines (디자인가이드) iOS 디자인 가이드 [APPLE]Human Interface Guidelines (디자인가이드) https://developer.apple.com/design/human-interface-guidelines/ Human Interface Guidelines - Design - Apple Developer Human Interface Guidelines Get in-depth information and UI resources for designing great apps that integrate seamlessly with Apple platforms. developer.apple.com iOS 기본 디자인 리소스도 다운받아 작업할 수 있다. https://developer.apple.com/desig.. 2020. 4. 8. [무료아이콘사이트] 무료 아이콘 및 웹 아이콘 사이트 https://www.flaticon.com/ Flaticon, the largest database of free vector icons Download all icons in SVG, PSD, PNG, EPS format or as webfonts www.flaticon.com 퀄리티 좋은 무료 아이콘이 많아서 좋은 사이트이다. http://fontello.com/ Fontello - icon fonts generator This site will not work if cookies are completely disabled. {"assets_hash":"96a7be2670463187f601636dbec273f8","page_data":{},"locale":"en-US","layout":"fontel.. 2020. 1. 21. [무료 이미지 사이트] 사진 이미지 전문 사이트 (unsplash, Gratisography, Jeshoots) unsplash는 상업용 이미지를 무료로 사용 할 수 있는 곳으로 고퀄리티의 감성적인 사진이 많아서 정말 좋은 사이트이다. https://unsplash.com/ Beautiful Free Images & Pictures | Unsplash Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos. unsplash.com https://gratisography.com/ Gratisography - Free High-Resolution Photos Hundreds of free high-resolution pictures you can us.. 2020. 1. 7. [디자인-color] 색상 참고 사이트 2 1. flatuicolor picker http://www.flatuicolorpicker.com/ Red CMYK color code | flatuicolorpicker : Best Flat Colors UI Design In flatuicolorpicker you can select the best color for your next project in flat design. Choose the red CMYK color code to use it for printing design www.flatuicolorpicker.com 색상별로 몇가지 주요컬러를 추출 할 수 있다. 2. uigradients (그라데이션 샘플 컬러 사이트) https://uigradients.com/#PinotNoir uiG.. 2020. 1. 6. 이전 1 2 다음
