본문 바로가기

디자인42

[AI활용]uiux, html&css 코딩 한번에 끝 클로드 활용, 웹사이트 코딩하기 개발 코드 잘 만들어 주기로 소문난 클로드를 활용해서 html css로 구성된 웹사이트를 만들어 보겠습니다. 결과물 먼저 보면 아래와 같아요. 생각보다. 그럴듯 하게 나와서 놀랐습니다...  심지어 반응형 까지 지원합니다!  AI 프롬프트 명령어 이전 글에서 Chat GPT를 통해 얻는 소스를 그대로 가져가서 입력했어요.  이전글 -https://lionbum.tistory.com/266 웹사이트를 디자인 해줘. 빵집이고, 타이틀은 오늘도 베이글 이야.(bagel for today)특징 - 심플한 레이아웃 –직관적인 구성으로 가독성 강화- 따뜻한 색감 – 브랜드 무드보드에 맞춘 컬러 적용- 고퀄리티 이미지 – 베이글과 매장의 따뜻한 분위기 전달- 깔끔한 폰트 – 가독성이 .. 2025. 3. 20.
[AI브랜딩/디자인] 빵집 브랜딩과 마케팅 AI로 브랜딩? 빵집도 가능할까?빵순이이자, 베이글 애호가로서 베이글 가게를 창업하는 것을 AI와 함께 시도해 보려고 합니다.아마도 먼 훗날 언젠가 진짜 열게 될지도 모를 베이글 가게.AI를 활용해서 브랜딩을 해보고 사이트 구축 까지 해보려고 합니다.브랜드명 정하기 베이글을 전문으로 파는 빵집을 열려고 해. 브랜드명을 추천해줘  따뜻하고 감성적인 네이밍오늘도 베이글 – "오늘도 좋은 하루, 오늘도 베이글!" 기분 좋은 시작을 알리는 느낌굿모닝 베이글 – 아침을 깨우는 따뜻한 빵집베이글하우스 – 편안한 동네 사랑방 같은 느낌빵-글빵-글 – 발음도 귀엽고, 빵이 부풀어 오르는 모습 같기도 한 이름둥글둥글 베이글 – 친근한 감성의 네이밍트렌디하고 힙한 네이밍BAGLE & CO. – 심플하면서도 세련된 BEIG.. 2025. 3. 18.
[피그마] 프레임을 늘리면 콘텐츠가 왜곡 및 변형 된다면? 한 방에 해결하는 방법! 피그마(Figma)를 사용하다 보면 프레임 크기를 조정했을 때 콘텐츠가 이상하게 늘어나거나 비율이 틀어지는 경험을 해본 적 있나요? 특히 벡터 파일이나 그룹화된 요소를 다룰 때 이런 문제가 자주 발생하곤 합니다. 저도 이 문제로 한참을 헤맸지만, 사실 해결 방법은 아주 간단했습니다. 1. 왜 이런 일이 생길까? 문제의 핵심은 Constraints(제약 조건) 설정에 있습니다. 피그마는 각 요소가 부모 프레임에 대해 어떻게 반응할지를 결정하는 Constraints 옵션을 제공합니다. 기본적으로 "Scale"로 설정된 경우 프레임 크기를 조정하면 내부 콘텐츠도 비율에 따라 늘어나거나 줄어들게 됩니다. 2. 문제 상황 예시프레임 크기를 늘렸더니 벡터 아이콘이 늘어나서 뭉개짐.텍스트 박스가 프레임과 함께 비율이.. 2025. 1. 13.
[포토샵활용] 레이어 마스크 바로가기키 설정으로 작업 속도 높이는 법 이렇게 귀여운 아이콘이 있습니다.하지만 배경이 흰색이라 사용하기가 애매 합니다. 포토샵에서 레이어 마스크를 사용 하면 손쉽게 투명 배경을 만들 수 있습니다! 근데 이런 아이콘이 100개. 흰색 배경을 제거 해야 한다면? 포토샵 바로가기키 설정으로 작업 속도를 높일 수 있습니다.  포토샵 레이어 마스크란?레이어 마스크는 이미지 수정 시 특정 부분을 숨기거나 나타낼 수 있는 도구입니다.디자인 작업에서 자주 사용됩니다.흰색 배경 없애기 1. 매직 툴로 흰영역 선택  흰색 배경 없애기 2. 선택 영역 확대(옵션) 선택 영역에 이런 부분이 없다면 안하셔도 됩니다. 아래처럼 픽셀이 애매한 부분을 저는 덜어내겠습니다.   확인을 누르면 아래 처럼 2픽셀 안으로 들어간 것을 확인 할 수 있습니다.  흰색 배경 없애기 .. 2024. 12. 17.
[why] 글래스모피즘(Glassmorphism)이 세련된 느낌을 주는 이유. 글래스모피즘은 최신 디자인 트렌드를 반영하는 스타일로,이미지의 분위기를 더 세련되게 만들어 줍니다.    글래스모피즘(Glassmorphism)이 모던하고 세련된 느낌을 주는 이유는 다음과 같은 디자인 특징들에 기반하고 있습니다: 투명성과 흐림 효과 (Frosted Glass Effect)글래스모피즘의 핵심은 반투명한 배경과 흐릿한 효과입니다.이는 마치 유리나 Frosted Glass처럼 보이는 효과로, 배경이 자연스럽게 흐려지면서 콘텐츠가 강조됩니다.이런 효과는 미니멀하고 세련된 느낌을 주기 때문에 복잡한 디자인 요소들을 단순화하고, 그 자체로도 아름다워 보입니다.  입체적인 느낌 (Depth and Layers)글래스모피즘은 시각적으로 깊이감을 만들어 줍니다.반투명한 레이어들이 배경을 비추고 있는 형.. 2024. 11. 29.
[figma]피그마 단축키 이 두개만 알면 작업 속도가 훨씬! 빨라집니다. 기존에 어도비 포토샵과 일러스트를 위주로 사용하시던 분들에게,피그마에 익숙해 지려면 이 두가지 단축키를 알고 시작하면 훨씬 빨라 집니다.   1. 속성 복사 / 속성 붙여넣기  요소를 선택한 뒤 마우스 우측 버튼을 누르면 아래와 같이 선택도 가능 합니다.  복사 Ctrl + Alt + C (윈도우)  / command + Alt + C (맥)기존 Ctrl + c/v 에서 Alt를 추가해 주면 됩니다!   폰트, 여백, 등 해당 요소의 스타일 속성이 복사 됩니다. 디자인 할 때 가장 많이 시간이 드는 단순 노가다의 시간을 줄여주는 키. 일러스트에 프로그램에서도 (가장 좋아하던) 속성을 복사하는 스포이드 키와 비슷하다고 보면 돼요!   2. 사이즈 조절 단축키 - K  피그마 왼쪽 상단에 move 와 sca.. 2024. 6. 17.
[피그마]와이어 프레임(wire frame) 제작, 유용한 템플릿 추천 피그마로 와이어 프레임 제작 할 때 유용한 템플릿을 몇개 추천 드립니다. 피그마 템플릿 검색 방법 https://www.figma.com/community 해당 부분에 들어가서 wire frame 으로 검색하면 다양한 템플릿이 나옵니다.  검색하면 다양한 템플릿이 나오는데요, 이중 유료도 있고, 플러그인을 활용하는 것도 있습니다.요즘 템플릿도 다 디자인이 잘 되어 나와서, 본인 디자인에 맞는 스타일을 골라서 쓰면 되는데요. 저는 몇가지 기준을 잡고 템플릿을 골랐습니다ui가 명확히 드러날 수 있는 디자인(강조요소 명확)너무 디테일 하지 않은 템플릿종종, 기획단계에서 지나치게 디테일 해지는 경우가 있습니다.  디자인의 자유도를 방해할 수 있기 때문에 적당히(?) 디테일하고 심플한 디자인을 찾다가 발견한 템플.. 2024. 6. 17.
디자인[웹사이트디자인/반응형] 웹사이트 영감 디자인 https://www.intercom.com/?ref=lapaninja Intercom: The complete AI-first customer service solutionIntercom is the complete AI-first customer service solution, giving exceptional experiences for support teams with AI agent, AI copilot, tickets, phone & morewww.intercom.com 2024. 4. 24.
[웹사이트디자인/반응형] Atoms - 어토믹해빗[아주작은습관의 힘 어플] https://atoms.jamesclear.com/?ref=lapaninja Atoms. The official Atomic Habits app Tiny changes, remarkable results! Atoms is the definitive habit app inspired by the groundbreaking principles of James Clear's best-selling book Atomic Habits. atoms.jamesclear.com 2024. 4. 22.
[figma]피그마 단축키 - 수평뒤집기, 수직 뒤집기 위처럼 화살표는 방향만 바뀌는 경우가 많은데, 그럴때마다 다시 아이콘을 찾을 필요 없이 단축키로 수직/수평 뒤집기를 해주면 됩니다. 피그마 실무 진행시 알아두면 좋을 단축키 피그마, 수평 뒤집기 수직 뒤집기 간단 하지만 알아두면 너무 유용한 피그마 단축키중 하나 입니다. 👍👍👍 2024. 3. 17.
[figma]피그마 아이콘 쉽게 사용 방법- 플러그인 활용 피그마 아이콘 쉽게 사용하기 UI UX 디자인을 할때, 가장 필요한 요소중에 하나가 아이콘 입니다. 필요한 아이콘을 빨리 찾는 것만으로도 시간이 많이 단축 되는데요! 이때 필요한 플러그인인 구글 머터리얼 아이콘 플러그인을 사용을 추천 드려요! 설치 방법 이렇게 하시면 팝업창이 뜨면서, 바로 사용이 가능해 집니다! 구글 머터리얼 아이콘 플러그인 사용법 아래와 같이 검색을 통해서 찾아주시면 금방 찾을 수 있습니다. 두께 변경 하기 다른 아이콘으로 변경 다양한 옵션들을 통해 편하게 쓰고 싶은 아이콘을 사용해 보세요! 감사합니다 :-) 2024. 3. 17.
브랜딩 컬러와 UI/UX의 활용 비법 색상 심리학을 잘 이용한 브랜드브랜드 컬러를 잘 정해서 좋은 디자인으로 보여지는 사례 5가지 Coca-Cola (빨간색) 빨간색은 강렬하고 활기찬 이미지를 전달하며, Coca-Cola는 브랜드 메시지와 함께 빨간색을 효과적으로 활용하여 전 세계적으로 인식됩니다. Apple (은은한 회색과 흰색) Apple은 심플하고 현대적인 이미지를 위해 은은한 회색과 흰색을 사용하며, 이 컬러 조합은 고급스러움과 혁신을 강조합니다. Facebook (파란색과 흰색) 파란색은 신뢰와 안정성을 상징하며, Facebook은 이 컬러를 활용하여 글로벌 소통 및 연결을 나타냅니다. Nike (주로 검정과 주황색) 검정은 고급스러움과 강인한 이미지를 전달하고, 주황색은 활기찬 에너지를 표현합니다. Nike는 이 두 가지 컬러를 .. 2024. 1. 18.
중국어 문장부호 알고 디자인/코딩 하기 안녕하세요! 오늘은 중국어 문장 부호에 대해서 필요한 만큼만(디자이너/퍼블리싱) 알아보겠습니다. 종종 다국어 홈페이지를 제작 하게 되는데, 그중 중국어를 만나 작업하게 될 경우 유의해야할 부분이 바로 문장 부호 입니다. 특히나, 중국어의 경우, 문장 부호에 따라 여백이 유난히 넓어 디자인에 영향을 주기도 합니다. 百度空间,让世界发现你阅读、下载、分享文档 위의 두 기호가 서로 다른 역할을 합니다. 둘다 쉼표 이지만, 역할을 달라요. 1. 반점 쉼표와 유사 합니다. 짧은 쉼을 나타냅니다. 가장 일반적인 것으로서 문장 중에서 가장 많이 쓰입니다.2. 모점반점보다는 짧은 쉼표라고 볼수 있습니다. 단어를 열거할때 쓰입니다. 모점은 쉼표와 비슷하게 생겼는데, 쉼표와 반대 방향으로 되어 있죠. 저처럼 중국어를 (일도).. 2023. 12. 12.
디자인 꿀팁! 포토샵과 xd 일러스트에서 아이콘을 폰트 처럼 사용하기 디자인을 하다가 가장 유용한것중에 하나가 바로 아이콘을 바로바로 사용하는 것입니다. 그중 가장 유용한게 바로 폰트처럼 아이콘 사용하는 것인데요! 구글 아이콘도 폰트처럼 사용 가능하다는 것을 발견 했어요! 사용법 1. 아래 사이트에서 사용할 아이콘을 골라줍니다. Material Symbols and Icons - Google Fonts Material Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants. fonts.google.com 2. 아이콘의 텍스트를 적어주세요. 3.폰트를 "Material Icons" 으로 변경해 줍니다. 그럼 텍스트로 .. 2023. 12. 1.
[디자인]색의 비율과 균형 , 강조 색상의 사용 60–30–10 규칙균형잡힌 색상을 구성하기 위한 조화로운 비율60% → 중성색 (흑/백) 30% → 보조색 10% → 강조색(악센트) 주로 실내 인테리어를 할때 많이 사용 하는 비율로 강조 색상을 10%비율로 설정 하는 것이다. 웹에서 강조색(CTA버튼) 웹에서는 5~10% 정도로 사용 해도 충분하기도 하다. CTA 버튼에 주로 사용 하여 사용자의 시선을 유도 한다. *CTA란? 마케팅에서 사용되는 용어입니다. CTA는 제품이나 서비스를 고객에게 판매하기 위해 사용되며, 보통 웹사이트나 광고 등에서 볼 수 있습니다. CTA는 고객에게 어떤 행동을 취하도록 유도하는 문구나 버튼입니다. 강조색에 인터랙션 추가마우스 호버시 → 밝게 마우스 포커스 시(클릭) → 진하게 강조색 사용 범위버튼, CTA 버튼, 링.. 2023. 9. 7.
앱/웹 디자인 Color (중요도에 따라) 모바일이나 웹 등 디자인시 가장 중요하다고 할 수 있는 부분이 바로 컬러 입니다. 의미에 따른 컬러 사용으로 다양한 정보를 제공 할 수 있기 때문입니다. 웹 앱 UI 디자인시 컬러의 의미와 사용법을 알아봤습니다. UI 디자인에서 컬러는? 상호작용 표현( 버튼, 체크박스, 컨트롤박스, 링크, 슬라이더) 의미 전달 (경고, 금지, 오류, 안전,긍정) 상태 전달 (활성/비활성, 컨트롤상태) 위계 순서 (중요도 순서) 강조 브랜드 컬러로서 - 브랜드를 나타내는 고유색 - 브랜드 통일감 - 사용자에게 동일한 경험과 메세지 전달 컬러의 구성 Primary color - 주색 Secondary color- 보조색(액션색상,강조색) 흑백 액션 색상(상호작용) 색상의 사용 버튼, CTA 버튼, 링크, 컨트롤, 토글, 스.. 2023. 9. 6.
[포토샵활용]gif 이미지 흰 테두리 없애기- 매트 설정 포토샵 에서 gif 내보내기배경이 있는 경우는 상관 없으나 투명 배경으로 내보낼때 주변에 흰테두리가 생기는 경우가 있습니다 이렇게 투명도가 전혀 먹지 않는 상태로 내보내 지게됩니다. 이때 몇가지 설정을 수정하여 내보내면 조금은(?) 나은 상태의 gif 투명 이미지를 만들 수 있습니다 기본설정 이렇게 미리 gif 이미지를 만들어 두었습니다. 웹용으로 저장 하기를 들어가서 설정을 확인 하면 투명디더 없음 / 매트 (흰샛배경) 으로 설정된 것을 볼수 있어요! 설정 수정 투명디더 없음 -> 확산 투명디더 매트 -> 없음 (양% 조절) 이렇게 두개를 설정해 주시고 저장을 눌러 주시면 됩니다. 결과는 이렇습니당 ㅠ 사실 투명도를 포함하는 완벽함 gif 만들기는 쉽지 않아요. 가능한 배경 색을 포함하는 gif 를 디.. 2023. 7. 5.
[피그마] 폰트나 이미지 크기 자동조절 되게 하기 버튼이나 그룹 내용 크기 자동조절 버튼 사이즈 변경 하기 그룹핑된 이 버튼의 크기를 변경시키키 고자 할때, Move 툴 선택 시 무브 툴을 사용하여 사이즈를 수정 하게 되면 Scale 툴 선택 시 내용이 흘러 넘치지 않고, 현재 스케일, 크기 비율에 맞게 줄어 들게 된다. 기존 어도비나 이미지 편집 툴에서는 Shift 키를 누르면 되는 기능이나, 피그마의 경우엔 툴을 변경해 주어야만 가능! 자주 쓰는 부분이므로 단축키를 알아두는 것이 좋을 듯 하다. 단축키 Move tool - V Scale tool - K 2023. 5. 15.
[디자인]중요한 정보를 강조 하는 방법 너무 쉬운 얘기지만 쉽지 않은 얘기이기도 하죠. 디자인을 할 때 중요한 정보를 강조하는 방법은 몇가지를 한번 찾아 보겠습니다. 0. 주인공 정하기 가장 중요한건, 디자인에서 주인공을 찾는 일입니다. 강조해야할 요소인 것이죠. 이 요소가 2개, 3개가 되면 정신없겠죠. 주인공을 정했다면 그 주인공을 강조할 수 있는, 방법들을 사용해서 강조를 해줍니다. 1. 사이즈 폰트 사이즈가 100px 넘는 사이즈로 제작 되었습니다. 생각보다 사이즈를 크게 주는 일이 디자인 할때는 쉽진 않습니다. 하지만 이왕 강조할 내용이라면 사이즈를 더해주고, 그외의 것들을 덜어 냄으로써 강조 할 수 있습니다. 2. 색상 대비 강렬한 색상대비를 줌으로써 강조하는 방법도 있습니다. 3. +- (덜어내고 더하기) 위의 포스터 처럼, 색상.. 2023. 1. 13.
[디자인]가독성을 높이는 5가지 디자인 방법 (여백 활용) 디자인은 결국 내용을 전달 하기 위한 하나의 수단이기에 가독성을 높여 내용이 한눈에 들어오도록 하는 것이 중요 합니다. 가독성이 높다는 것은 여백을 잘 활용한다는 뜻입니다. 말을 할때도 호흡을 하듯이 이야기 하듯이 디자인에서도 여백으로 호흡을 주어 하고자 하는 말이 더 명확히 들릴 수 있도록 하는 것입니다. 여백 활용 하는 방법 1. 여백을 균일 하게 맞춘다. 아래 애플 사이트를 보시면 좌우 여백을 균일 하게 맞추고 각 요소들의 사이 간격도 균일하게 맞춰져 있습니다. 2. 제목과 세부내용이 구분된다. (시각적 점프 비율이 높다) 킨포크 웹사이트의 내용을 보면 제목과 내용의 글자 크기 차이를 크게 두어서 구분이 확실히 되도록 하였습니다. 3. 배경과 내용이 구분된다. 4. 자간이 적절하다. 우리가 일반적으.. 2023. 1. 13.
[포토샵]가이드, 안내선 설정 (웹사이트디자인시) 웹사이트 디자인, 웹사이트 레이아웃 설정 컨텐츠 너비 1320px (네이버 홈페이지 기준)로 설정한다고 하면 마진 값을 좌/우로 300씩 주어서 기본 가이드 레이아웃을 설정해 주면 됩니다~! 가이드 선 디테일한 설정 ctrl + K 설정으로 들어가셔서 units & rulers 부분과 Guides, Grid & Slice 부분을 수정해주시면 됩니다! 2023. 1. 13.
[포토샵]해상도와 사이즈 설정(인쇄용300dpi, 웹용72dpi) 안녕하세요! 포토샵 작업에 앞서 가장 첫번째로 해야할 일이 새문서를 만들면서 문서 설정을 하는 일입니다. 문서의 목적 첫번째로 생각해 봐야 할 것은 문서의 목적입니다. 1. 웹용 : 블로그나, 홈페이지, 페이스북, 인스타그램등의 웹사이트에 업로드 2. 인쇄용 : 프린트 목적 1. 웹용 해상도 72dpi 사이즈 : 웹사이트( 1920px X 1080px ), 인스타그램 업로드용(1080px X 1080px) 해상도 (resolution) : 72 color mode : RGB 1-2. 웹용 포스터 시안 : 210 X 297(mm) 2. 인쇄용 해상도 300dpi 사이즈 : 포스터( 210mm X 297mm ) 해상도 (resolution) : 300 color mode: CMYK 기타 속성 아트보드(art.. 2023. 1. 13.
[Figma] 피그마 에서 지마켓 폰트 사용, 피그마 로컬 폰트 사용 방법 피그마에서 내 컴퓨터에 있는 폰트 사용하기 피그마는 기본적으로 브라우저 기반 프로그램이기 때문에 내 컴퓨터에 저장되어 있는 폰트를 바로 쓰는게 불가능 합니다. 지인에게 피그마로 디자인 작업을 해서 전달을 했는데,폰트 수정이 안된다고 하더라구요. 방법- 폰트 인스톨러 (font-installers) 설치 https://www.figma.com/downloads/?fuid=843356296609220310 www.figma.com 위 사이트에 접속 해서 폰트 인스톨러 설치를 해준다음 다시 해당 파일경로로 재접속을 하면 이처럼 물음표가 사라지고 수정이 가능한 형태가 됩니다~! 개인적으로 디자인 작업 할 때 자주 쓰는 폰트가 바로 지마켓 폰트예요.상업적으로 무료 이용이 가능하고 두꺼운 글자(bold) 와, 얇은.. 2023. 1. 6.
[book] 그놈의 마케팅-브랜딩이란? 브랜드란?  브랜드란 제품이나 서비스를 직간접적으로 경험한 뒤 느끼는 고유한 인상 Ex) 애플, 삼성 - 직·간접적 경험 : 제품을 직접 사용, 광고, 마케팅 의도가 담긴 모든 것- 고유한 인상 을 모든 사람들이 공감할 수 있어야 함 브랜딩이란? 모두가 공감하는 고유한 인상을 남기는 과정,결과가 아닌 과정에 해당하는 모든 활동을 지칭할 수 있다.‘직·간접적인 경험을 만들어내는 활동’활동 : 광고 제작, 웹사이트제작, 브랜드의 SNS 계정을 운영 등 브랜드의 일관성 브랜딩의 성패를 좌우하는 것 : 매력적인 인상 & 이를 얼마나 일관되게 유지해 나갈수 있는가일관성을 유지하는 방법을 하나 꼽으라면나는 주저하지 않고 ‘디테일의 지속성’ 을 강조한다.콘텐츠 자체의 완성도를 높이는 디테일도 중요하다. 꼼꼼하게 일하.. 2022. 10. 6.
일러스트와 포토샵 가장자리, 바운딩 박스, 테두리상자, 크기조절 박스 안보일때 포토샵 - 가장자리 테두리 상자(바운딩박스)가 보이지 않을 경우. 포토샵 작업 하다가,, 갑자기 뭐 잘못 눌러서 변형 하게 해주는 상자, 테두리가 안보일때가 있다. 단축키를 암기 ctrl+h 하면 좋지만 그마저도 생각이 안난다면 우선 보기 메뉴를 들어가서 표시자 를 선택해 주며 보인다. 일러스트 - 가장자리, 테두리 바운딩 상자가 보이지 않을 경우 이렇게 잘 보이던 테두리 상자가 갑자기 안보여서, 수정이 불편한 상황이 되었을때. 일러스트도 포토샵과 마찬가지로 단축키 ctrl+h 를 눌러주면 보인다. 바운딩 박스의 경우 ctrl+ shift + b 포토샵과 일러스트의 단축키가 살짝 다르다. 2022. 3. 30.
[일러스트, 포토샵]일러스트 왜곡, 둘러싸기 형태 아웃라인 따기 일러스트- 폰트 아치형 만들기 폰트를 쓴 뒤에 둘러싸기 효과를 주면 폰트를 아치형으로 바꿀 수 있다. 부채꼴 스타일로 주면 아치형의 글자가 완성! 텍스트에 따라 모양이 다소 부자연 스럽게 나오는 경우가 있다. 자간 간격을 주어도 해결이 안될 경우, 폰트 아웃라인을 따 줘야 한다. 오브젝트 - 둘러싸기왜곡 - 확장 메뉴 보통은 Ctrl+o 를 눌러 주면 텍스트의 아웃라인이 만들어 지지만, 둘러싸기 왜곡을 적용한 경우엔 위 메뉴로 들어가서 확장을 해줘야 한다! 계속 Ctrl+o 눌러 주다가.. 안대서 찾아봄... 후 .. 2022. 3. 25.
일러스트 활용 - 사진 이미지를 벡터(일러스트로) 바꾸기 + 색상 보정 사진 일러로 바꾸기 사진 이미지(jpb, png)등을 벡터(ai)로 바꿔야 하는 때가 종종 있다. 출력을 해야 하거나, 고해상도의 이미지를 원할때가 있기 때문에. 이미지 확대시 벡터 확대시 벡터 색상 보정 ** 일러에서도, 디테일하게 색상 편집과 보정이 가능하므로, 포토샵까지 가서 작업할 필요가 없다! 이미지 벡터로 변경 하기 1. 이미지 불러오기 2. 이미지 포함 시키기 * 포함을 눌러주면 X 자 모양이 사라짐 ( 이걸 안누르면 나중에 이미지가 안불러와 짐- 현재는 경로만 갖고온 상태 ) 3. 이미지 추적 - 충실도가 높은 사진 이미지 벡터화 진행 중 **색이 많은 이미지나, 배경이미지 같은 것으로 하면 너무 느려 지므로, 컴퓨터가 계산하는데 너무 오래 걸리므로 가급적 작은 이미지등에만 사용 하는게 좋.. 2022. 3. 20.
[무료/상업이용] 타이틀로 좋은 가나초콜릿체 모든 사용자가 이용 가능한 가나초콜릿체 본문 용으로 쓰기엔 두껍고 타이틀 용으로 쓰기에 적합한 두께의 폰트. 폰트=가나초콜릿 브랜드 느낌이 너무 비슷하긴 한데, 레트로한 느낌도 좀 있고, 폰트 자체의 초콜릿의 부드러운 느낌도 들어있어서, 다양하게 활용이 가능한 폰트. 폰트 주요 특징 라이센스 다운로드 https://www.lotteconf.co.kr/prcenter/gana 가나초콜릿체 < 홍보센터 < 롯데제과 가나초콜릿의 분위기와 풍미를 살린 서체컨셉 www.lotteconf.co.kr 2021. 12. 2.
맥)mac OS 주요 단축키 - 삭제 관련 Command + delete = 선택파일 삭제 선택 파일을 바로 휴지통으로 이동한다. 대화상자 없이 바로 삭제가 된다. Command +shift+ delete = 휴지통 비우기 휴지통 비우기 단축키 2021. 11. 22.
맥)mac OS 주요 단축키 - 종료관련 Command + Q = 앱,어플,finder창 종료 파인더 창을 닫아 버리거나, 어플을 완전히 종료(하단 아이콘 사라짐)를 위한 단축키 Command + W = 창 닫기 사파리, 크롬 등의 브라우저 창(or 탭) 닫는 단축키 Command + option + ESC = 앱 강제종료 앱을 강제 종료 하는 단축키. 앱이나 파인더가 사용하닥 멈추거나 할경우 사용하는 단축키 2021. 11. 22.
728x90
반응형