• 

  [html,js,css] ai 클로드 활용, 플러그인 없이, 스와이프 슬라이드 만들기 슬라이드를 넣고 싶을때, 주로 플러그인을 활용하지만 종종, 간단한 슬라이드가 필요할때가 있습니다. 그래서 모바일에서 터치 슬라이드로 활용할 수 있는 슬라이드를 만들고자,클로드 ai를 활용해서 슬라이드를 제작해 봤습니다.  코드 생성은 클로드 https://claude.ai/ 를 활용했습니다.  클로드 ai  요청 명령어" html 과 css 만으로 모바일에서 좌우로 스와이프 되는 기능이 있는 슬라이드를 만드려고해. 오른쪽이나 왼쪽으로 스와이프 하면 다음이나 이전 페이지로 넘어가는거야. 각 페이지에는 정중안에는 h3의 텍스트가 위치해 있어. 페이지는 무한정으로 생산 가능하게" 1. html  첫번째 슬라이드 .. 댓글 2 2025.03.12

• 리액트 네이티브,
  태그 줄바꿈 하기 리액트 네이티브에서는 HTML의 태그를 직접 사용할 수 없습니다.대신 다음과 같은 방법들로 줄바꿈을 구현할 수 있습니다: 개행 문자 사용 {`2024.06.21 13:00 \n ~ 2024.06.21 14:00`} 여러 Text 컴포넌트 사용 2024.06.21 13:00 {"\n"}~ 2024.06.21 14:00 줄바꿈이 필요한 부분을 분리 2024.06.21 13:00 {"\n"} ~ 2024.06.21 14:00  이 중 첫 번째나 두 번째 방법이 가장 간단하고 일반적으로 사용됩니다.\n은 줄바꿈 문자로, 텍스트를 새 줄로 나눕니다. 댓글 1 2025.02.04

• 

  [웹폰트 사용방법] 웹에 최적화된포맷 - woff2 웹사이트 성능을 최적화하는 방법: 가벼운 웹폰트 포맷 선택하기! 웹폰트 종류가 여러개 인데, 무엇을 선택 해야 할지 확실히 잘 모르는 경우가 있어요.  폰트 선택은 웹사이트 로딩 속도와 사용자 경험에 직접적인 영향을 미치기에 중요합니다!    예를들어 저는 pretendard 서체를 사용하려고 하는데, 홈페이지에서 제공하는 폰트의 포맷 종류가 아래와 같이 여러개 입니다.  출처 : https://cactus.tistory.com/306?category=1007051   폰트 포맷 종류.otf, .ttf: 고품질이지만 무겁고, 웹에서는 비효율적..woff, .woff2: 웹에 최적화된 경량 포맷. 특히 .woff2는 파일 크기가 작아 로딩 속도가 빠름..woff2 포맷의 이점파일 크기 작고, 압축률 높아 .. 댓글 0 2024.08.29

• 

  [웹 디자인/퍼블리싱] 디자인시 PC 화면 사이즈 정하기(+미디어쿼리 분기점) 웹디자인/ 퍼블리싱 디자인 할 때 화면 크기를 어느정도로 잡아야 할지 정확히 잘 모를때가 있다. 가로값 기본은 1980이라면 높이값의 경우 모니터 사이즈인 1080이 아닌 약 1053 으로 해야 한다(상단URL 부분등 제외) 디자인 작업할때 자주 쓰는 해상도와 높이값 1. 1920 x 1080일명 FHD(Full High Definition)라고 불리는 해상도24인치 데스크탑, 보편적인 모니터 크기의 해상도XD 나 figma 에서 작업시 뷰포트는 1053px💡 브라우저의 상단 부분의 URL 과, 북마크 등의 높이값을 빼고 작업을 한다. viewport는 약, 1053px 정도로 설정 2. 1536 x 864FHD 노트북의 해상도1920 x 1080에 125% 배율을 적용한 해상도노트북 폰트 사이즈 기본 .. 댓글 0 2023.07.06

• 

  [피그마]와이어 프레임(wire frame) 제작, 유용한 템플릿 추천 피그마로 와이어 프레임 제작 할 때 유용한 템플릿을 몇개 추천 드립니다. 피그마 템플릿 검색 방법 https://www.figma.com/community 해당 부분에 들어가서 wire frame 으로 검색하면 다양한 템플릿이 나옵니다.  검색하면 다양한 템플릿이 나오는데요, 이중 유료도 있고, 플러그인을 활용하는 것도 있습니다.요즘 템플릿도 다 디자인이 잘 되어 나와서, 본인 디자인에 맞는 스타일을 골라서 쓰면 되는데요. 저는 몇가지 기준을 잡고 템플릿을 골랐습니다ui가 명확히 드러날 수 있는 디자인(강조요소 명확)너무 디테일 하지 않은 템플릿종종, 기획단계에서 지나치게 디테일 해지는 경우가 있습니다.  디자인의 자유도를 방해할 수 있기 때문에 적당히(?) 디테일하고 심플한 디자인을 찾다가 발견한 템플.. 댓글 1 2024.06.17

• 

  [일러스트, 포토샵]일러스트 왜곡, 둘러싸기 형태 아웃라인 따기 일러스트- 폰트 아치형 만들기 폰트를 쓴 뒤에 둘러싸기 효과를 주면 폰트를 아치형으로 바꿀 수 있다. 부채꼴 스타일로 주면 아치형의 글자가 완성! 텍스트에 따라 모양이 다소 부자연 스럽게 나오는 경우가 있다. 자간 간격을 주어도 해결이 안될 경우, 폰트 아웃라인을 따 줘야 한다. 오브젝트 - 둘러싸기왜곡 - 확장 메뉴 보통은 Ctrl+o 를 눌러 주면 텍스트의 아웃라인이 만들어 지지만, 둘러싸기 왜곡을 적용한 경우엔 위 메뉴로 들어가서 확장을 해줘야 한다! 계속 Ctrl+o 눌러 주다가.. 안대서 찾아봄... 후 .. 댓글 0 2022.03.25