본문 바로가기

interactive_design/mobile_design38

UI/UX 디자이너들이 알면 쓸모있는 다양한 개발 지식 https://velog.io/@dus532/03-UIUX-%EA%B0%9C%EB%B0%9C%EC%9D%84-%EC%9C%84%ED%95%9C-%EB%94%94%EC%9E%90%EC%9D%B4%EB%84%88%EB%93%A4%EC%9D%98-%EA%B8%B0%EB%B3%B8-2bk2o6rfgb [01] Viewport와 해상도[02] 폰트[03] 그림자와 블러[04] SafeArea[05] 아이콘 (중요하지 않음) 2020. 5. 27.
종이 프로토타이핑이란 무엇인가? https://www.youtube.com/watch?v=4ZRzJTczMCE 2020. 5. 20.
[인터렉1]뮤직 믹싱관련 앱 UI 참고 spire http://www.spire.live/#app 메트로놈으로 박사를 맞추고 그위에 오디오를 한트랙씩 쌓아가는 방식 2017. 4. 21.
증강현실 포케몬 게임 Pokemon Go http://cafe.naver.com/paramsx/128476 2015. 9. 11.
모바일 앱 디자이너가 꼭 알아야 할 벤치마킹 사이트 13선 출처 : http://ppss.kr/archives/24086 모바일 앱 디자이너가 꼭 알아야 할 벤치마킹 사이트 13선 2014년 7월 14일 by 정진호 화면구성에 대한 고민. 고민. 고민. 각 페이지의 프레임을 제공하거나 장면전환의 아이디어를 얻고 싶은 사람들에게 벤치마킹은 언제나 필요하다. 간단하게 각 사이트가 어떠한 특징이 있는지만 정리해 보고자 한다. 정리기준: 카테고리 유/무, 기타 특징. 1. http://www.mobile-patterns.com/ 카테고리(OK) 안드로이드/아이폰 화면 제공. 2. http://uxarchive.com/ 카테고리(OK) 아이폰 전용. 별도의 앱만 따로 볼 수 있는 기능 제공. 3. http://pttrns.com/ 카테고리(OK) 아이폰/아이패드/iOS7.. 2015. 1. 31.
프로그래밍 없이 혼자하는 앱개발 툴app building tools 앱 인벤터 app inventor 를 이용하면 자신이 원하는 간단한 아이폰, 안드로이드 앱을 만들어 볼수 잇습니다. 토드 교수님 수업에 가르치고 있습니다. 그외에도 다양한 앱 빌딩 툴들이 쏟아져 나오고 있습니다. 만약에 만들고자 하는 앱이 간단한 거라면 개발자 없이 직접 만들어 볼 수 있습니다. http://mashable.com/2013/12/03/build-mobile-apps/ 2014. 6. 4.
아이패드 앱 데모 영상 KASHIWASATO KASHIWASATO.COM for iPad from THA on Vimeo. 2014. 6. 3.
식물 관리 앱 - 물주기 등 Koubachi http://www.koubachi.com/ 어떤 식물인지를 선택하면, 물을 언제주는지 알려줌. 센서를 화분에 꽂아두면 데이터를 모아서 와이파이로 알려줌 . 2014. 5. 27.
Sen.se 앱 - mother의 개념으로 가족의 데이터를 모아서 처리하는... 엄마가 쿠키라는 센서를 통해서 가족들을 돌봐야 하는데이터를 처리하고, 관리할수 있도록 해줌. https://sen.se/ 2014. 5. 27.
앱 프로토타입 영상 환자 의학 데이터 보고서 형태의 아이패드 앱... 2014. 5. 22.
터치기기를 위한 디자인 팁 9가지 1. 가장 중요한 터치 영역을 확인하라 2. 콘텐츠를 컨트롤 위에 배치하라... 3. 선례에 따르는 것이 좋다 4. 화면 크기만 보고 터치 특성이 같다고 생각하면 안 된다 5 .모든 데스크탑 디자인도 터치를 고려해서 만들어야 한다. 6. 터치 영역은 최소 44*29 픽셀 이상으로 하라 7. 수직으로 44 픽셀 vertical rhythm을 만들어라 8. 아이콘이 클 수록, 가까이 있을수록 터치가 쉽다 (Fitts의 법칙) 9. 스크린만 생각하고 디자인하지 말고, 센서를 생각하고 디자인하라 http://bahns.net/5673522 2014. 5. 9.
수학앱 유아용 도형으로 배우는 수학 : 유아용 https://itunes.apple.com/us/app/prestobingo-shapes/id494347130?mt=8 위의 앱 디자인 한 회사 http://spurdesign.com/ 2014. 5. 1.
앱비쥬얼 디자인에 필요한것: 앱 패턴 갤러리, UI 가이드, 그리드, 아이콘 모바일 앱 패턴 갤러리 http://www.mobile-patterns.com/http://www.lovelyui.com/ 아이폰 UI 가이드 https://developer.apple.com/library/ios/design/ 안드로이드 UI 가이드http://developer.android.com/design/index.html 한글 무료 글꼴, 웹폰트http://blog.bsmind.co.kr/890 아이폰 그리드 참고http://uielements.net/mobile-guides/iphone-5-grid-psd/ 안드로이드 그리드 참고http://developer.android.com/design/style/metrics-grids.html 좋은 앱디자인 참고http://www.webdesigne.. 2014. 4. 29.
모바일 앱 컨셉 동영예제 2013. 10. 29.
모바일 앱 이미지 프로토타입 만드는 툴과 방법 http://baak.me/2012/08/%EC%A0%84%EB%9E%B5%EC%A0%81%EC%9D%B8-%EB%AA%A8%EB%B0%94%EC%9D%BC-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9D%B4%ED%95%91%EC%9D%84-%EC%9C%84%ED%95%9C-%EC%8B%A4%EC%A0%84-%EA%B0%80%EC%9D%B4%EB%93%9C/ 파워포인트나 아크로뱃리더를 이용하는 것도 같은 원리 https://groups.google.com/forum/?fromgroups#!topic/uiuxstudy/XGzDXiJGZQA 키노트 프로토타이핑 만드는 방법 영상http://vimeo.com/20778110http://keynotekungfu.com/ 가장 쉬운방.. 2013. 6. 10.
프로토타이핑 영상 만들기 참고 A-Camp 3기 위펫, 박혜령 작업 A-Camp 3기 최고의 여친, 김보람 작업http://vimeo.com/56126269/ 안드로이드 폰 플레이스토어에서 '최고의 여친'을 찾아주세요. 2013. 5. 27.
안드로이드 앱을 쉽게 개발하는 툴 초등 고학년이나 중고등 학생들에게 앱개발을 쉽게 가르치기 위해서 나온 어플리케이션 http://appinventor.mit.edu 2013. 3. 31.
본과 김보람 4학년 학생의 최고의 여친 모바일앱 론칭(안드로이드폰) 안드로이드폰 가진 학생 모두 다운로드 해주세요!!! 인터렉티브 미디어 디자인 2 수업과 A-Camp 에서 진행한본과 4학년 김보람 학생과 김민수 님이 개발한 최고의 여친 마켓에 올라갔습니다. 데모영상http://vimeo.com/56126269/ 안드로이드 폰 플레이스토어에서 '최고의 여친'을 찾아주세요. 페이스북 로그인은 문제가 있을수 있습니다. 아이디 만들어서 로그인하셔요. 2013. 3. 6.
[인터렉티브 미디어] 디바이스별 해상도 Tablet, mobile, & email iPad: 1024x768 Landscape orientationiPad: 768x1024 Portrait orientationiPhone: 640x960 Portrait orientationEmail: 640px Desktop environments Standard: 972px Widescreen: 1144px IAB-Friendly: 1000px (Allows for a 320px-wide sidebar that can house a 300x250 unit with 10px of padding.)출처 :http://www.ravelrumba.com/photoshop-grids/ 위의 출처에 가면 아래쪽에 각각의 해상도에 해당하는 포토샵 화일이 들어있는 zip.. 2012. 9. 17.
모바일 UX 4주차 인터페이스 디자인 & 시각 디자인 보호되어 있는 글 입니다. 2012. 6. 20.
모바일 UX 3주차 프로토타이핑 테스트 보호되어 있는 글 입니다. 2012. 6. 20.
모바일 UX 2주차 디자인 컨셉 보호되어 있는 글 입니다. 2012. 6. 8.
모바일 UX디자인 소개 및 리서치, 퍼소나, 시나리오 보호되어 있는 글 입니다. 2012. 5. 30.
NPR.org 의 아이패드 앱 개발 프로세스에 대한 기사 웹사이트를 앱으로 개발할때 참고하면 좋은 기사 실제 디자인 결과물에 가까운 페이퍼 프로토타이핑 테스트를 통하여 오류를 최소화함 http://www.snd.org/2010/04/inside-the-design-process-for-nprs-ipad-app/ 2012. 4. 16.
인터렉티브 미디어 디자인 1: iPad 화면 스케치 관련 정보 및 템플릿 3주차 과제에 도움이 될만한 샘플이 있는 기사 : http://www.onextrapixel.com/2010/09/29/40-brilliant-examples-of-sketched-ui-wireframes-and-mock-ups/ http://inspirationfeed.com/inspiration/25-examples-of-wireframes-and-mockups-sketches/ http://webdesignledger.com/inspiration/18-great-examples-of-sketched-ui-wireframes-and-mockups 참고 : (인디자인을 사용한 예는 아니니 작업 프로세스만 봐둘것) http://webdesignledger.com/tips/getting-started-in.. 2012. 3. 25.
나와 같은 얼굴을 한 강아지 입양하기 앱 http://awardlook.com/oneshow/integrated/pedigree/dogalike/ Dog-A-Like http://itunes.apple.com/au/app/dog-a-like/id441893795?mt=8&ls=1 2012. 3. 6.
증강현실을 이용한 캔버스화 아이폰용 앱 증강현실을 이용한 캔버스화 아이폰용 앱 간단한 인터페이스이면서도 제품선택에서 구매까지 구현 http://judgeseyesonly.com/converse-sampler-app 다운로드는 여기에서 http://itunes.apple.com/us/app/the-sampler-by-converse/id392276032?mt=8 2012. 3. 6.
아이폰 아이패드 UI 개발 키트 http://webdesignledger.com/freebies/11-ui-kits-for-iphone-and-ipad-development 다운로드 페이지 http://www.teehanlax.com/downloads/ 2012. 2. 22.
CSS3 참고자료 by 전무익님 앱센터 목요일 스터디에서 전무익님이 발표해주신 내용입니다. 출처 : http://uxuistudy.tistory.com/14 발표 슬라이드 http://slides.html5rocks.com/#css3-title (출처: http://www.html5rocks.com/ - 구글에서 제작한 슬라이드입니다.) 참고자료 Safari CSS Reference: http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariCSSRef/Introduction.html Mozilla CSS Reference: https://developer.mozilla.org/en/CSS/CSS_Reference 예제 http:/.. 2011. 12. 6.
모바일웹 만들기 1. 모바일 페이지 작성시 사파리로 테스트 방법 1) 스마트폰으로 직접 페이지 열어보기 2) 사파리 브라우저를 이용한 개발자 도구 이용하기 3) 다운로드 http://www.apple.com/safari/download/ 위의 URL에서 웹브라우저 인스톨러를 다운로드 받습니다. 인스톨 하시고 나서 오른쪽 상단에 톱니바퀴같은것을 보실수 있습니다. 이 톱니 바퀴를 선택하시면 여러개의 메뉴가 보이고 "기본설정.."이라는것을 선택하시면 새로운 창에 여러가지가 뜹니다. 그중에 고급 아이콘을 클릭하시면 하단에 "메뉴 막대에서 개발자용 메뉴 보기"라는 것에 체크박스를 표시합니다. 그리고 나서 네모난 종이같은 아이콘은 상단 에서 클릭하면 "개발자용"이라고 메뉴가 새로 보이는 것을 확인할수 있습니다. "개발자용"을 클릭.. 2011. 11. 29.