[디자인] 쉬운 앱 디자인 툴 XD

in kr •  6 years ago  (edited)

안녕하세요. @u robotics 입니다.
이번에는 전에 배웠던 앱 디자인을 쫌 풀어쓸까 합니다.

adobe XD cc라는 툴을 쓸 껍니다 .
무료 툴입니다.
(물론, 어도비 답게 앱 1개만 무료고,
여러개 할려면 유료입니다. ㅋㅋ)

다운로드 주소는 여기입니다.
https://www.adobe.com/kr/products/xd.html

0.jpg

화면이 굉장히 사용하기 쉽게 되어있죠.
다운로드도 금방 찾을 수 있어요.

어도비 XD cc 다운로드 받아주세요.

그리고 프로그램을 열어보시면요.
1 선택화면.jpg

저는 첫 번째로 아이폰 화면을 선택해봤어요.
1-2 선택 고른 화면.jpg

클릭하면 이런 화면이 나옵니다.
2 앱화면.jpg

제가 선택한 아이폰. 그리고 1번째 화면이다.
이런 뜻이죠.
2 앱화면(수정).jpg

저는 다시 열다 보니깐
화면이 작아서 안 보여서
키워봤어요.

엑셀, 파워포인트 등과 마찬가지로
ctrl + 마우스 휠. (위) 를 해주시면
화면이 커집니다.

3 키운 화면1.jpg

이런 너무 커졌네요.
화면이 없어져 버렸습니다.

3-2 너무 키운 화면.jpg

이상한 점이 있는데요. 정면에 맞춰서 커지지 않는다는 거죠.
그러면 화면을 정면으로 맞추려면 어떻게 해야될까요?

스페이스 바 + 마우스 왼쪽 클릭.
이 화면은 왼쪽으로 너무 갔으니깐,
오른쪽으로 끌어내야겠죠.?!

스페이스 바 누르면서
마우스 왼쪽 클릭으로
화면 오른쪽으로 끌어주세요.

그러면 이렇게 나옵니다.

기본 화면 컨트롤은 이정도면 돼요.

4 스페이스 바-오른쪽.jpg

그러면 사각형을 그려봅시다.
왼쪽에서 사각형을 선택해주세요.

5 사각형을 그려 봅시다.jpg

그리고 화면에 놓으면 사각형이 그려집니다.

5-2 사각형 그렸음.jpg

사각형을 그리면
오른쪽 밑에 선택할 수 있는 것들이 나옵니다.
PPT랑 비슷해요.

5-1 선택틀.jpg

채우기를 눌러서
사각형의 색을 바꿔봅시다.

주의할 것은 화살표로 가리키는 포인트
여기를 클릭해야
사각형의 색깔이 바뀐다는 겁니다.

5-3 여길 선택해야 바뀜.jpg

화면 왼쪽에서
기타 도형들을 그려봅시다.
역시 PPT랑 비슷해요.

원, 선, 다각형들 각각 그려보시면 됩니다.

6 기타 도형들.jpg

왼쪽에서 T자를 누르시면
글자 쓰기도 됩니다.

7 글자 쓰기.jpg

오른쪽에 보시면
속성 바꾸는 게 있어요.
글자 크기를 80으로 바꿔보니깐
엄청 커집니다.

7-2 글자크기 바꿈.jpg

마지막으로
새 화면 추가하기를 해봅시다.
역시 왼쪽에서 새화면 추가 아이콘을 누르시고
기존 앱 화면을 누르시면
새 화면이 또 생깁니다. ㅋㅋㅋ

8 새로운 화면.jpg

무한으로 생성되시는데
멈추고 싶으시면
왼쪽에서 화면추가 아이콘 말고
다른 아이콘을 눌러주시면 됩니다.

맨 위의 화살 아이콘이 가장 무난하겠네요.

오늘 어도비 XD cc 디자인 수업은 여기까지 입니다.
^^ 앱 디자인 한 번 도전해보시길 ㅋㅋㅋ

감사합니다.

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

즐거운 스팀잇 생활하시나요?
무더위야 가라!!!!

예 ㅎㅎ 시원함아 와라 ㅋㅋ

오홋~!
디자인 툴 소개 감사합니당~ ^^

bluengel_i_g.jpg Created by : mipha thanks :)항상 행복한 하루 보내셔용^^ 감사합니다 ^^
'스파'시바(Спасибо스빠씨-바)~!

블루엔젤 님 감사합니다. ^^ ㅎㅎㅎㅎ 행복한 하루 보내셔용 ㅎㅎㅎㅎ

앱 1개는 무료로 만들어 볼수 있겠어요~

예. 무료가 좋죠. ㅋㅋㅋ 근데 계속 지우고 또 만들면 되니깐,
동시에 여러앱 작업을 못 한다 뿐이지
거의 무한인듯요. ㅋㅋㅋ

오~ 오도비 엑스디~ 이거 10분쓰고 꺼버렸어염...저랑은 안맞는 툴인것 같아소(사실 베타버전땤ㅋㅋ) 전 oven 이 나름 편하더라구욤

오호.. ㅇ_ㅇ 글쿤요. 저는 그냥 교육받은 게 이 툴 뿐이라서 한 번 올려봤어요. ㅎㅎㅎㅎ 오 oven 좋은 모양이군요. 한 번 써보겠습니다. ㅎㅎㅎ

역시 천재 개발자 ㅋㅋ

고맙습니다. 타나마님. 천재개발자 이름을 되찾아야겠어요. ㅎㅎㅎㅎ

괜찮은 툴 같네요.
주말에 한번 테스트 해봐야겠어요.

예. 코딩맨님 뭔가 이거 쓸만한 것 같아요. ㅎㅎㅎㅎ

WARNING - The message you received from @habibur81 is a CONFIRMED SCAM!
DO NOT FOLLOW any instruction and DO NOT CLICK on any link in the comment!

For more information, read this post:
https://steemit.com/steemit/@arcange/phishing-site-reported-steembottracker-dot-trade

If you find my work to protect you and the community valuable, please consider to upvote this warning or to vote for my witness.

thankyou arcange

이 툴로 실제 사용가능한 앱 제작이 가능한 건가요..??

앱 디자인요. 안드로이드 수튜디오에 xml인가에 추가해주면 앱 디자인으로 쓸 수 있다고 해요. 버튼 같은거 지정할 수 있는지도 모르겠네요. 해봐야겠어요.

해당 툴에서는 디자인만(!)이군요.. 곧 '모기 잘 잡는 법' 후기 올리겠습니다
제 글에 @urobotics님 글의 일부분을 캡쳐해서 업로드 할 예정인데 괜찮으신지요..

예. 디자인만 입니다. ㅎㅎ 오홋 모기정복인가요. ㅋㅋ 물론이죠. 마음껏 사용해주세요. ㅎㅎㅎ 출처를 알려주시면 더 감사 ㅎㅎ

오호 기종마다 템플릿이 다 준비되어 있군요. 이제 개발만 하면 되네요 ~~ ㅎㅎ

예. 저도 냅니다. ㅋㅋㅋ 화이팅. 뀨님도 음악앱 한 번 ㅋㅋㅋ

템플릿이 넘쳐나도 제일 중요한 개발을 못합니다 ㅋㅋㅋ

저도 젤 중요한 개발을 못합니다. 그래서 개발 공부 중이에요. ㅎㅎㅎ 이번 기회에 개발을 잘 할 수 있게 되길 열망합니다. ㅎㅎㅎㅎ

  ·  6 years ago Reveal Comment

thank you for watching habibur81 ^^ happy day.

링크 조심하세요 =_=;; 스캠으로 추정됩니다

아하 그렇군요. ^^ ponzipanda 님 감사합니다.