롤스토리디자인연구소

카본(carbon)재질의 패턴 3가지 입니다. 처음 카본 느낌이 나는 패턴은 도대체 어떻게 그려졌을까 했는데 간단하게 2픽셀 정도의 단위로 서로 비슷하지만 다른색깔을 채워서 만드는 거였습니다. 여하튼 필요하신분들에게 좋은 자료가 되었으면 합니다. (사진을 클릭하면 보다 정확하게 보실 수 있습니다) ▲carbon fiber pattern 01 ▲carbon fiber pattern 02 ▲carbon fiber pattern 03

deviantart사이트에서 배포하고있는 Metal Mesh Patterns 입니다.위의 그림처럼 총 12개의 메탈메쉬패턴이 있으며 아래 사이트 링크하여 가시면 바로 다운로드 받을 수 있습니다. 메탈메쉬패턴 다운로드

클래식한 라디오 아이콘을 만들어 보겠다. 이번 가이드가 내용은 심하게(?)많은 편이지만 천천히 따라하다보면 쉽게 할 수 있을것이다. 저번 테이크아웃커피컵처럼 펜툴로 직접 그려야 하는 쉐이프가 없기 때문이다. 01.가로 650px, 세로 500px의 캔버스를 생성한다. 02.기본적으로 백그라운드를 어둡게 만들고, 새로운 레이어를 하나 생성한뒤, 아무 색상이나 채운다.(백그라운드를 그대로 복사해도 된다) 그리고 Fibers를 줄건데, Fibers필터는 전경색과 배경색이 무엇이냐에 따라서 마치 나무결모양의 이미지를 만들 수 있다. 위의 그림처럼 전경색과 배경색을 나무색상과 비슷하게 한뒤 Filter - Render - Fibers를 적용한다. 03.새레이어에 Fibers가 적용 됬다면 트랜스폼(command ..

보통 원통같은 모양에 글자나 쉐이프등을 새긴다하면 위의 왼쪽 그림처럼 원통의 기울기등을 생각하지 않고 텍스트등을 새기기 마련이다. 하지만 실제로 원통모양에 새겨진 글자는 위의 오른쪽 그림처럼 글자도 원통과 똑같이 구부러져 있다. 포토샵에서 자연스럽게 원통같은 물체에 글자등을 구부려 새기는 방법을 알아보자. 우선 위와 같이 원통이 있다고 가정하자. 01.일단은 원통에 입힐 글자나 쉐이프 등등을 기본적으로 만든다. 02.글자등을 원통의 각도에 맞게 구부리기 위해선 우선은 기준이 될 척도가 필요하다. 따라서 빈레이어를 하나 생성하고 위의 4마디 꼭지점처럼 기준이 되는 점을 찾고 Marquee툴을 이용하여 선택영역을 잡은뒤 눈에 띄는 색상을 입히고(전경색 채우기:alt + delete) 투명도를 50%정도로 조..

테이크아웃 커피 컵.. 불과 몇년 전만 하더라도 이런 테이크아웃컵을 보면 이게 뭔가 했을 수 도있지만 이제는 누구나 보면 커피컵이구나 하는걸 알 수 있다. 테이크 아웃 커피컵을 만들기 전, 일단은 이런씩의 Skeuomorphism(스큐어모피즘) 디자인은 원래 도구의 형태를 그대로 따라간다는 큰 내용을 담고 있다. 그러므로 스큐어모피즘의 아이콘에서 일단 가장 중요한 것은 아이콘등으로 만들 객체의 실제모습을 참고 하는것이 제일 좋다. 어찌됬건 아래의 과정을 보며 따라해보자. 01.가로세로 512px의 캔버스를 만든다. 02.테아크아웃커피컵의 몸체가 될 부분을 만들어야 한다. 쉐이프툴을 이용하여 직사각형 모양의 쉐이프를 만든다. 03.테이크아웃커피컵의 몸통부분을 만들기 위해 위의 그림과 같이 가이드선을 이용하..

teehanlax사에서 현재 배포하고 있는 iOS7 GUI의 PSD파일 입니다. 링크타고 가시면 압축된파일을 다운로드 받을 수 있으며 압축을 풀면 PSD파일이 존재 합니다 ▲많은 프리셋 ▲작은 아이콘까지 레이어로 있습니다. ▲추가적인 부분까지 있습니다. ▲그룹으로 정리가 잘 되어있으며, 왠만하면 레이어로 모두 존재하는걸 확인 했습니다. 아래의 링크를 타고 가면 바로 다운로드 받을 수 있습니다. http://www.teehanlax.com/tools/ios7/ 저또한 그렇지만 올가을에 출시될 iOS7에 관심이 있으신분들이 많으리라 생각합니다. 무엇보다도 요번에 전면적으로 개편된 UI부터 확연한 관심을 끌게 만들고 있습니다. iOS7에 관심있으신분들은 PSD파일을 다운로드 받아 참조하면 향후 디자인 하는데 ..

7월의 첫번째 포스팅 이다. 이번시간에는 편지봉투 모양의 아이콘 제작과정을 살펴 보도록 하겠으며 혹여 6월에 포스팅된 제작가이드를 몇번 따라해봤더라면 이번 아이콘도 쉽게 제작 할 수 있을 것이다. 또한, 다시말하자면 필자의 작업환경은 윈도우가 아닌 매킨토쉬 포토샵 CS6로 작업을 했음을 알리며 다른 외관적인 부분은 모두 비슷하나 윈도우의 ctrl키가 맥에서는 command키 라는걸 알린다. 편지봉투 아이콘을 만들어 보자. 01.가로세로 512px의 캔버스를 만든다.(rgb,72dpi,sRGB) 02.그림과 같이 가이드라인을 가운데에 맞춰놓고 회색톤의 배경을 깐다.(흰색 배경에서 바로 작업해도 좋으나 편지봉투 아이콘이 주로 흰색으로 이루어지기 때문에 배경과 구별짓기 위해서 이다) 03.그어놓은 가이드라인의..

올해 6월에 처음 포스팅을 시작하게되어 이번 달을 마무리 하며 6월 한달동안(사실 보름정도)만들었던 제작가이드며, 리디자인한 작품등을 보기쉽게 정리 하였습니다. 다음 7월에도 더 많은 글과 더 많은 정보를 포스팅 하도록 노력하겠습니다. - GUI/UI/UX의 모든것(이미지를 클릭하면 해당글로 링크 됩니다) ■ 제작 가이드 모음 ■ UI 및 리디자인

▲iOS7키패드 리디자인(rollstory.tistory.com) iOS7의 키패드 디자인을 다시 작업해 보았습니다. 기존에 공개되었던 iOS7 베타버전의 키패드 GUI/UI구성이 여러모로 말이 많았습니다. 저의 개인적인 생각과 다른 글들을 참조하여 최대한 저의 느낌대로 한번 리디자인 해보았습니다. 왼쪽 첫번째부터 iOS6의 키패드 이미지, 이번에 공개된 iOS7 Beta, 그리고 3번째사진이 제가 다시 구성해본 iOS7 Re-design 버전입니다. iOS6의 키패드가 습관이 되어서 그런지 솔직히 처음 iOS7의 키패드 디자인을 봤을땐 뭔가 모르게 조금 이질감이 들었습니다. 물론, 애플이 요번에 새로이 UI를 전면 개편함으로써 플랫디자인을 추구하는 경향을 띄었으나, 역시 베타버전은 뭔가 모르게 너무 심..

iOS7 App Icon Template 입니다. PSD파일 받으시면 위와같은 파일이 열립니다. 레티나등 실 규격 사이즈에따라 실제 쉐이프가 레이어로 존재하니 앱디자인하실때 유용하리라 생각합니다.