찐망고'S 퍼블리싱그리고디자인

안녕하세요 찐망고입니다.  CSS에서 그라디언트는 background-image 속성으로 적용됩니다. 그러나 그라디언트는 직접적인 값의 변화가 아니라, 하나의 이미지처럼 렌더링 되기 때문에CSS의 `transition` 속성을 사용해도 그라디언트의 색상이나 위치가 부드럽게 변화하지 않습니다.그래서 그걸 해결하려면!! 가상 요소를 사용하기 가상 요소(::before 또는 ::after)를 사용하여 기존 요소 위에 그라디언트를 덮고, opacity 속성을 이용해 부드럽게 보였다 안보였다 하도록 설정합니다. .element { position: relative; width: 200px; height: 200px;}.element::before { content: ""; position: absolut..

티몬의 시작은 2010년 5월 10일로, 대한민국 최초의 소셜커머스 플랫폼이었다.그 당시 ' 티켓몬스터 '라는 이름으로 출발해, 공구를 통해 상품과 서비스를 할인된 가격에 제공하는..이때 함께 기억하는 브랜드가 바로 마녀공장이다.티몬의 인기에 힘입어 마녀공장은 출시 초기부터 큰 성공을 거뒀던 기억이 난다.출시한 지 일 년도 안되어 대박 난 마녀공장!!그때 당시 브랜드 화장품 외에 (우리가 흔히 알고있는 대기업 화장품들)듣도 보던 중소기업 화장품 브랜드를 판매할 유통망은 아예 없었다고 해도 무방하다.홈쇼핑, 백화점 모두 마다할 때 손을 내밀었던 건 그때의 티켓몬스터아마 티몬이 없었더라면 지금의 마녀공장은 어떻게 되었을까 궁금하다.  특히, 가성비가 뛰어난 제품으로 주목받았던 마녀공장은,티켓몬스터의 저렴한 ..

안녕하세요 찐망고입니다. 제가 오늘은 네이티브앱, 하이브리드앱, 웹앱을 좀 쉽게 포스팅해보려고 해요.그니까 머랄까 다들 대충은 알고 있잖아요?대충은 아는데 내가 아는 게 맞나 싶을 때 이 포스팅 읽으면 해결됨 자 먼저 1. 네이티브 앱(Native App)네이티브 앱은 특정 플랫폼(iOS, Android)을 위한 전용 언어와 개발 도구로 개발된 애플리케이션인데요.iOS 앱은 Swift나 Objective-C로, Android 앱은 Kotlin이나 Java로 작성됩니다.Kotlin개발자가 전세계에서 작년 연봉 1위라면서요? 부럽다.. 주요 특징: 최적화된 성능: 하드웨어와 직접 상호작용하므로 높은 성능과 속도를 제공네이티브 UI/UX: 플랫폼별 UI 가이드라인을 따라 사용자 경험이 최적화광범위한 API 접..

안녕하세요 찐망고입니다.CSS의 너무 기초적인 부분을 포스팅하려고 합니다. CSS(Cascading Style Sheet)란 웹 페이지의 겉모습을 정의하고 꾸미는 데 사용되는 스타일 시트 언어인데요. 주요 기능은 다음과 같습니다:  레이아웃 정의: 페이지의 구조와 배치를 지정합니다.스타일 설정: 텍스트의 글꼴, 색상, 크기 등을 지정합니다.디자인: 배경, 테두리, 여백 등을 설정하여 페이지의 시각적 디자인을 조정합니다.반응형 디자인: 다양한 장치(데스크톱, 태블릿, 스마트폰 등)에 맞게 레이아웃과 스타일을 조정합니다.   CSS는 기본적으로 선택자(Selector)와 선언(Declaration)으로 구성되며, 선언은 속성(Property)과 값(Value)으로 이루어집니다. h1 { color: ..

안녕하세요 찐망고입니다.작년 여름에 개인정보취급방침에 대해서 포스팅했는데요. 개인정보처리방침안녕하세요 찐망고 입니다. 웹사이트에서 푸터에 해당하는 부분을 보면 꼭 들어가는 내용이 있죠?카피라이트, 사업자정보, 그리구 개인정보처리방침!!!!   개인정보처리방침이란?개인정보보uiweb.tistory.com 오늘은 웹사이트 저작권 표시 관련 포스팅을 해볼까해요네 맞아요 그친구 © ㅎㅎ  웹사이트 저작권표시란? 웹사이트 저작권 표시는 웹사이트의 콘텐츠가 저작권법에 의해 보호받고 있음을 알리는 역할을 합니다. 이는 법적 보호뿐만 아니라, 사용자들에게 콘텐츠를 무단으로 복제하거나 배포하지 않도록 경고하는 역할도 합니다.   저작권 표시의 중요성  법적 보호: 저작권 표시는 저작권 소유자가 콘텐츠에 대한 권리를 주장..

안녕하세요 찐 망고입니다. 최근 Config 2024에서 재설계된 Figma UI3을 소개받았는데요.새로운 UI3은 디자인 경험을 단순화하려고 노력한 흔적이 보입니다.그리고 생각보다 많이 바뀌었어요. 해당 링크를 참고 삼아 포스팅해보려고 합니다.https://help.figma.com/hc/en-us/articles/23954856027159-Navigating-UI3-Figma-s-new-UI  내비게이션 패널:UI 최소화: 클릭 아이콘으로 탐색패널과 속성패널을 축소할 수 있음파일 이름 및 위치:  파일이름 옆 드롭다운 아이콘을 통해 파일이동, 라이브러리, 브랜치생성, 버전기록등을 손쉽게 수행할 수 있음.Assets탭: 구성요소를 검색, 탐색, 삽입하는 과정이 더 쉬어짐     - 이전 피그마 page..

안녕하세요. 찐망고입니다. 오늘은 Apple Touch Icon 관련 포스팅을 해볼까 하는데요. Apple Touch Icon은 iOS기기에서 웹 사이트를 홈 화면에 추가할 대 사용하는 아이콘 입니다.이 아이콘을 설정하면 사용자가 웹 사이트를 홈 화면에 추가했을 때 표시되는 아이콘 이미지를 지정할 수 있습니다. 물론 Apple Touch Icon을 웹 사이트에 추가하는 것이 필수는 아니지만,홈화면 추가시 iOS 기기의 홈화면에 아이콘이 깔끔하게 표시됩니다.만약 이 아이콘이 없다면 기본 웹 브라우저 아이콘이나 웹사이트의 축소된 화면이 표시될 수 있는데 그거 정말 너무나 별로겠죠?또한 Apple Touch Icon을 설정하는 것은 최신 웹표준을 따르는 좋은 관행 중 하나입니다.   Apple Touch Ic..

안녕하세요 찐망고입니다.오늘은 favicon에 대해 포스팅 할겁니다.  파비콘이란?  모든 브라우저의 탭엔 제목이 있고 그옆엔 저렇게 파비콘이 붙어요.물론 없어도 큰일 나지는 않지만, 있으면 이뻐! 파비콘은 브라우저 탭, 북마크, 즐켜찾기 목록에서 웹사이트를 대표하는 작은 아이콘입니다.이를 통해 사용자는 쉽게 웹사이트를 인식하고 찾을 수 있어요.일관된 브랜드 이미지 구축에도 도움이 되구요. 파비콘의 중요성사용자가 여려개의 탭을 열어놓았을때, 탭이 아주 작아지는 경험들 다들 있으시잖아요?파비콘이 있으면 제목이 뭔지 몰라도 웹사이트를 빠르게 식별할 수 있습니다. 또한, 일부 검색 엔진은 파비콘을 검색결과에 표시하기도 합니다.당연히 사용자의 클릭률(CTR)을 높이는데 기여할 수 있죠 제일 중요한건 파비콘이 없..

안녕하세요 찐망고 입니다. 오늘은 현재 가장 인기있는 프로그래밍언어에 대해 포스팅을 해볼까 하는데요. 2023년 Scala, Go, 그리고 Kotlin개발자가 연봉이 가장 높은 3대 개발자로 선정 되었다고 해요.출처에 따르면 대다수의 Kotlin개발자(66%)는 Android 및 서버측 애플리케이션에 사용한다고 합니다.Java에 비해 코드가 더 간결하고 읽기 쉽고, Java와 완전히 호환되어 기존 Java프로젝트에 쉽게 통합할 수 있습니다. Scala는 데이터 처리 및 분석, 웹 개발, 분산 시스템 개발에 주로 사용되며,Go는 서버 및 네트워크 애플리케이션, 클라우드 및 컨테이너 기술, 도구 및 유틸리티 개발에 많이 사용됩니다  현재 프로그래밍 언어지수를 볼까요?   지난 3년 동안 JavaScript,..

안녕하세요 찐망고 입니다. 이전 글에 직접 사용해 본 HTML에디터 종류에 대해서 포스팅했는데요. 퍼블리싱 할 때 직접 사용해본 HTML에디터 종류안녕하세요 찐망고입니다. 오늘은 HTML에디터 관련 포스팅을 해보려고 하는데요~ 일단 에디터를 사용하게 되면 코드를 좀더 깔끔하고 직관적으로 볼 수 있고, 자동완성기능이 있어 코딩하는데uiweb.tistory.com 오늘은 2024년 최신 IDE 및 텍스트 에디터 점유율에 대해 알아보려고 합니다. 최근 서치 해보니 Top IDE Index 라는 자료를 찾을 수 있었어요.전 세계 텍스트 에디터와 IDE사용현황을 나타내는 지표죠. IDE는 통합 개발 환경(integrated Development Environment)의 약자로,소프트웨어 개발을 위한 종합적인 도구..