| 비영리단체를 위한 사회공헌 미디어교육 입니다.
시선을사로잡는블로그
ITProBono@Daum4강교재
1) 디자이너가 아니어도 디자인을 잘하려면
2) Canva, 쉽고 재밌게 콘텐츠 디자인
3) 온라인 포토샵 Pixlr로 이미지 배너 만들기
4) 멋진 시각자료를 만드는 툴
5) 디자인을 돕는 리소스 모음
6) 흥미로운 ...
디자이너가 아니어도
디자인을 잘하려면
01
디자이너가 아니어도 디자인을 잘 하려면, 개념 #1
디자인은 [ ]다.정보
디자인은 [ ]다.소통
상대에게 나를 보다 정확히 이해시키는 행위
(c)Vise versa design studio
디자이너가 아니어도 디자인을 잘 하려면, 개념 #2
디자인은 [ ]다.브랜드
단순한‘출력’이아니라‘철학’이흐르게하는것
디자이너가 아니어도 디자인을 잘 하려면, 개념 #3
디자인은 [ ]다.메시징
디자인 스스로가 행동을 유도한다
디자이너가 아니어도 디자인을 잘 하려면, 개념 #4
디자인은 [ ]다.기획의 결과
디자이너가 아니어도 디자인을 잘 하려면, 개념 #5
디자인은궁극의결과이다
좋은 디자인이란.
출처 : 오늘의 유머 “디자이너를 괴롭히는 방법”
5가지만 기억해요
좋은 디자인을 위해
1. 좋은 데이터를 확보합시다.
- 키워드, 슬로건, 정보
2. 디자인의 자원(요소)를 챙깁시다.
- texture, photo, icon, illust
3. 폰트는 정말로 중요합니다.
- 타이포 디자인
4. 레이아웃이 ‘가독성’의 끝
- 정보와 데이터를 조화롭게 배치
5. 디자인의 완성, 직관과 디테일
- 많이 만들어볼 것, 지인의 10초 안 반응
Canva,쉽고재밌게콘텐츠디자인 02
www.canva.com
웹포스터,SNS홍보물,캠페인에영감을주는디자인까지-
Facebook 또는 메일로 간단 가입 Social Media (800*800) 클릭
간단한 메뉴 이미지 파일로 저장이미지 소스를 편집화면으로 드래그
화면을 계속해서 추가할 수 있습니다.리소스는 무료/유료가 있어요
온라인 포토샵 Pixlr로이미지배너만들기 03
새 이미지 생성 파일명과 넓이, 놃이를 설정, 투명은 체크하지 않습니다.
꼭 챙길 4가지 도구 1) 배너의 배경 - 현재 색으로 원하는 배경 색깔을 결정한다.
2) 문자 도구 - 텍스트를 입력한다. (ex: 방명록)
3) 선택 도구 - 이미지 불러와서 원하는 곳에 배치
4) 레이어 & 이동 ...
1) 완성된 이미지는 컴퓨터에 저장합니다.
2) 티스토리 비공개글로 이미지 파일을 업로드 합니다.
3) 이미지 URL 복사를 합니다.
4) 아래의 코드로 배너를 만듭니다.
<a href=”http://이동하고 싶은 UR...
[미리보는 심화과정]
Header 이미지 로고 넣기
같은 원리로 만들어진 이미지 URL
관리자화면 > 스킨 > HTML/CSS에서 각각 수정하면 적용 가능.
HTML
CSS
[참고]http://itprobono.tist...
멋진디자인을만드는툴 04
인포그래픽:정보를디자인하는방법론
www.infogr.am(인포그램)
www.piktochart.com(픽토차트)
인포그래픽스제작툴
디자인을돕는자료모음 05
http://www.letscc.net/ http://pixabay.com/
저작권 없이 다양한 이미지 자료를 검색하여 사용할 수 있습니다.
http://publicdomainvectors.or...
www.picmonkey.com
픽머니는 아주 심플한 방식으로 사진을 꾸며주는 툴입니다. 아기자기하고 이쁜 도구들이
많아서 SNS와 블로그에 산뜻한 느낌의 콘텐츠를 올리고 싶을 떄 활용하면 좋은
이미지 편집 유틸리티 입...
[ ]
06흥미로운프리젠테이션Prezi
text image video
프레지가특별한이유프레임&패스
본 강의안은 IT ProBono@Daum
워크숍 교재로 제작되었으며,
‘저작자(IT ProBono@Daum/SMLab)’을 표시하고
비영리/동일조건(변경금지)로 공유가능합니다.
감사합니다. 모든 문의와 의견은,
http...
[IT ProBono@Daum]  4강 시선을 사로잡는 우리 기관 블로그 만들기
[IT ProBono@Daum]  4강 시선을 사로잡는 우리 기관 블로그 만들기
Upcoming SlideShare
Loading in …5
×

[IT ProBono@Daum] 4강 시선을 사로잡는 우리 기관 블로그 만들기

2,614 views
2,586 views

Published on

디자이너는 아니지만 멋진 이미지도 편집하고 인포그래픽도 활용해 보고 싶으신가요? 간단한 웹배너를 쓱싹쓱싹 만드는 비결까지, 시선을 사로잡는 우리 기관 블로그를 위해서 어떻게 하면 좋을지 만나보세요!

* 본 자료는 Daum 사회공헌팀과 미디어교육 프로젝트 SMLAB이 함께하는 IT ProBono@Daum 비영리 ICT를 위한 활용교육 워크숍 자료입니다. 영리 목적 외에 자유롭게 공유 및 활용 가능합니다. / 수정 재배포 불가

Published in: Marketing
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,614
On SlideShare
0
From Embeds
0
Number of Embeds
1,907
Actions
Shares
0
Downloads
20
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

[IT ProBono@Daum] 4강 시선을 사로잡는 우리 기관 블로그 만들기

  1. 1. | 비영리단체를 위한 사회공헌 미디어교육 입니다. 시선을사로잡는블로그 ITProBono@Daum4강교재
  2. 2. 1) 디자이너가 아니어도 디자인을 잘하려면 2) Canva, 쉽고 재밌게 콘텐츠 디자인 3) 온라인 포토샵 Pixlr로 이미지 배너 만들기 4) 멋진 시각자료를 만드는 툴 5) 디자인을 돕는 리소스 모음 6) 흥미로운 프리젠테이션 툴 Prezi 4강 미리보기
  3. 3. 디자이너가 아니어도 디자인을 잘하려면 01
  4. 4. 디자이너가 아니어도 디자인을 잘 하려면, 개념 #1 디자인은 [ ]다.정보
  5. 5. 디자인은 [ ]다.소통 상대에게 나를 보다 정확히 이해시키는 행위 (c)Vise versa design studio 디자이너가 아니어도 디자인을 잘 하려면, 개념 #2
  6. 6. 디자인은 [ ]다.브랜드 단순한‘출력’이아니라‘철학’이흐르게하는것 디자이너가 아니어도 디자인을 잘 하려면, 개념 #3
  7. 7. 디자인은 [ ]다.메시징 디자인 스스로가 행동을 유도한다 디자이너가 아니어도 디자인을 잘 하려면, 개념 #4
  8. 8. 디자인은 [ ]다.기획의 결과 디자이너가 아니어도 디자인을 잘 하려면, 개념 #5 디자인은궁극의결과이다
  9. 9. 좋은 디자인이란. 출처 : 오늘의 유머 “디자이너를 괴롭히는 방법”
  10. 10. 5가지만 기억해요 좋은 디자인을 위해
  11. 11. 1. 좋은 데이터를 확보합시다. - 키워드, 슬로건, 정보
  12. 12. 2. 디자인의 자원(요소)를 챙깁시다. - texture, photo, icon, illust
  13. 13. 3. 폰트는 정말로 중요합니다. - 타이포 디자인
  14. 14. 4. 레이아웃이 ‘가독성’의 끝 - 정보와 데이터를 조화롭게 배치
  15. 15. 5. 디자인의 완성, 직관과 디테일 - 많이 만들어볼 것, 지인의 10초 안 반응
  16. 16. Canva,쉽고재밌게콘텐츠디자인 02 www.canva.com 웹포스터,SNS홍보물,캠페인에영감을주는디자인까지-
  17. 17. Facebook 또는 메일로 간단 가입 Social Media (800*800) 클릭
  18. 18. 간단한 메뉴 이미지 파일로 저장이미지 소스를 편집화면으로 드래그 화면을 계속해서 추가할 수 있습니다.리소스는 무료/유료가 있어요
  19. 19. 온라인 포토샵 Pixlr로이미지배너만들기 03 새 이미지 생성 파일명과 넓이, 놃이를 설정, 투명은 체크하지 않습니다.
  20. 20. 꼭 챙길 4가지 도구 1) 배너의 배경 - 현재 색으로 원하는 배경 색깔을 결정한다. 2) 문자 도구 - 텍스트를 입력한다. (ex: 방명록) 3) 선택 도구 - 이미지 불러와서 원하는 곳에 배치 4) 레이어 & 이동 도구 - 해당 레이어 선택 후 객체를 이동시키기
  21. 21. 1) 완성된 이미지는 컴퓨터에 저장합니다. 2) 티스토리 비공개글로 이미지 파일을 업로드 합니다. 3) 이미지 URL 복사를 합니다. 4) 아래의 코드로 배너를 만듭니다. <a href=”http://이동하고 싶은 URL주소”> <img src=”방금 복사한 이미지 URL”> </a> 5) 사이드바 > 태그입력기 > 반영
  22. 22. [미리보는 심화과정] Header 이미지 로고 넣기 같은 원리로 만들어진 이미지 URL 관리자화면 > 스킨 > HTML/CSS에서 각각 수정하면 적용 가능. HTML CSS [참고]http://itprobono.tistory.com/101
  23. 23. 멋진디자인을만드는툴 04 인포그래픽:정보를디자인하는방법론
  24. 24. www.infogr.am(인포그램) www.piktochart.com(픽토차트) 인포그래픽스제작툴
  25. 25. 디자인을돕는자료모음 05 http://www.letscc.net/ http://pixabay.com/ 저작권 없이 다양한 이미지 자료를 검색하여 사용할 수 있습니다. http://publicdomainvectors.org/ https://www.iconfinder.com/
  26. 26. www.picmonkey.com 픽머니는 아주 심플한 방식으로 사진을 꾸며주는 툴입니다. 아기자기하고 이쁜 도구들이 많아서 SNS와 블로그에 산뜻한 느낌의 콘텐츠를 올리고 싶을 떄 활용하면 좋은 이미지 편집 유틸리티 입니다. www.prezi.com 프레지는 이미 많은 기획자, 디자이너, 강연 발표자들에게 인정 받고 사랑을 얻은 시각 자료 만들기 프로그램의 대명사라 할 수 있겠습니다. 관심있는 이야기소스들을 화면에 배치하고 에니메이션을 돌리면 누구나 효과적인 시각 자료 만들기를 이용할 수 있습니다.
  27. 27. [ ] 06흥미로운프리젠테이션Prezi text image video
  28. 28. 프레지가특별한이유프레임&패스
  29. 29. 본 강의안은 IT ProBono@Daum 워크숍 교재로 제작되었으며, ‘저작자(IT ProBono@Daum/SMLab)’을 표시하고 비영리/동일조건(변경금지)로 공유가능합니다. 감사합니다. 모든 문의와 의견은, http://itprobono.tistory.com

×