Screely : 웹 사이트 목업 생성
나의 블로그나 사이트를 스크린샷으로 캡쳐하고 해당 이미지의 그림자 효과 등 다양하게 꾸며보고 싶다면 멋진 확장프로그램 및 사이트를 이용할 수 있습니다. 목업 이미지로도 활용할 수 있어 포트폴리오 등으로 구성하기에 좋은 이미지로 만들어줍니다.
1. 맥 사파리 목업이미지(Safari Mockup)로 생성
스케치나 포토샵 템플릿을 사용하지 않고도 스크린샷을 아름다운 디자인의 모형으로 즉시 바꿀 수 있습니다. 배경과 구분이 되지 않는 사진이거나 조금 더 감각적으로 이미지를 보여주고 싶을 때, 집중도를 높일 수 있는 목업템플릿 사이트 Screely는 구글 확장프로그램으로도 있어 쉽게 캡쳐한 이미지에 배경을 추가할 수 있습니다.
2. 이미지 통일성 구축
글을 쓰다보면 이미지를 캡쳐해서 작성하는 경우가 많은데, 이미지의 통일성을 갖출 수 있어 굉장히 유용한 프로그램이라고 생각이 됩니다.
3. Screely 사용방법
사용방법은 매우 간단합니다. 사이트(또는 확장프로그램)에서 이미지를 드래그하거나 복사 붙여넣기 혹은 클립보드에 저장된 이미지의 경우는 그대로 붙여넣기 단축키를 입력하면 배경이미지를 넣을 수 있습니다.
평범한 사이트를 사파리로 보는 것과 같이 배경을 삽입할 수 있습니다.
투명한 색깔부터 자유롭게 색을 설정하거나 창의 타입도 변경할 수 있습니다.
Chrome 확장 기능은 모든 웹 페이지를 스크린샷하여 Screely에 로드합니다.
더 이상 수동으로 스크린샷을 찍고 Screely를 열어 업로드할 필요가 없습니다!
4. Screely 기능
Padding 값을 수정해서 안쪽의 수직과 수평의 여백을 조절할 수도 있고 색상도 컬러피커로 다양한 색을 설정할 수도 있습니다. 이미지는 JPG, PNG, SVG 세 가지 확장자로 변경해서 저장할 수 있습니다.
윈도우 창을 아예 없을 수도 있고 검색 입력창을 삽입할 수도 있습니다.
버튼의 형태는 사파리의 기본색상과 그레이 컬러, 선으로만 되어 있는 버튼 혹은 버튼이 없는 형태로 설정이 가능합니다.
확장프로그램 설치 및 실행
Screely - Generate Website Mockups
Edit Crop your image, rotate it, flip it or skew it. Annotate it by drawing, writing text or adding shapes to it. Make it exactly what you want with our editing possibilities
www.screely.com
Screely: Instant Browser Mockups
Instantly turn your page into a beautiful browser mockup you can share anywhere
chrome.google.com
같이보기
맥북 클레이목업(Clay iMac 27” Mockup)
그리드는 수정 가능한 영역을 보여줍니다. 다크모드 안에서 어떻게 맥북이 작동하는지 보여줍니다. iMac 27" Mockup 디스플레이의 클로즈업 뷰에서 미리 볼 수 있습니다. 클레이 목업으로 측면의 색
creativestudio.kr
아이폰 클레이 목업 번들(Three iPhone Bundles Mockup - FREE)
아이폰 화이트 컬러 클레이 목업 파일입니다. 경량화 버전으로 최대 사이즈는 가로 1920 사이즈에 맞춰져 있습니다. 매우 가벼운 파일로 빠르고 쉽게 작업할 수 있는 목업 파일입니다. 세련되고
creativestudio.kr
아이폰 목업 iPhone Clay Frontal Mockup
A white frontal iPhone clay mockup for Photoshop. This mockup is part of the premium iPhone Clay Set with additional Sketch vector versions by Ramotion. 흰색 정면 아이폰 목업 파일이며, 스케치..
creativestudio.kr
Ipad Pro 9.7 White Mockup(아이패드 프로 9.7 화이트 목업)
Here is the white version of iPad Pro 9.7 mockup. File resolution 4000 x 3000 pixels. Two smart objects for screen (book and portrait orientations) Two different drop shadows. Premade overlays. ZIP..
creativestudio.kr
'Kit > Chrome extensions' 카테고리의 다른 글
| 구글 크롬 다크모드 설정방법(+ 확장프로그램 다크 리더) (0) | 2023.01.30 |
|---|---|
| React Developer Tools(리액트 구글 확장프로그램 도구) (0) | 2022.08.05 |
| 사이트를 내 마음대로 바꾸는 구글 크롬 확장 프로그램 'Stylebot' (0) | 2022.08.05 |
| 구글 검색 마케팅 도구 확장프로그램 'Keyword Surfer' (0) | 2022.08.05 |
| 웹사이트 코드 변경 크롬 확장프로그램 'User JavaScript and CSS' (0) | 2022.08.05 |
| 구글 애드센스 달러를 원화로 표기해주는 자동 환율 변환 확장프로그램 'Chrome Currency Converter(CCC)' (2) | 2022.08.05 |
| 구글크롬 다크모드 확장프로그램 'Dark Mode On Chrome' (0) | 2021.01.08 |
| 페이스북 모든 메세지 일괄삭제(Delete All Messages) (0) | 2020.10.22 |
