gui 97

[포토샵]땡땡이패턴을 이용하여 질감 표현하기

halftone pattern필터와 블랜드 모드를 이용하면 이미지에 땡땡이 느낌의 질감을 표현 할 수 있습니다. 정확하게 말하자면 'Dot'이라고 하지만 실제로 보면 '+' 모양입니다. 하지만 패턴을 입히고 이미지를 원본으로 보면 원처럼 보입니다. 이번시간에는 이런 방법으로 이미지에 땡땡이 느낌의 질감을 입혀 보겠습니다. (이미지를 클릭하면 큰사이즈로 보실 수 있습니다) ▲ 원본사진(윗쪽)과 작업결과물(아래쪽) 01.백그라운드 레이어를 하나 복사한다.(흰색배경의 레이어 생성) 02.땡땡이 느낌의 필터를 입히기 위해 일단 전경색과 배경색을 내가 원하는 색상 으로 지정하고(보통 회색계열로 쓴다), Filter - Filter Gallery로 이동한다. 전경색과 배경색은 후에 halftone pattern 필..

Tip/Photoshop 2013.10.29

[포스터제작]매일신문은 우리의 눈이 됩니다.

우연찮게 알게 되어 급하게 작업하여 제출하게된 공모전 최종 작업물 입니다. 매일신문에서 주최로 하였는데, 아무래도 부족한 부분이 많이 있네요. 게다가 어떻게 보면 지방신문사라 과연 이러함(?)을 얼마나 이해해줄 수 있을지 더욱 궁금합니다. 기존에 만들었었던 flat카메라 아이콘을 응용하여 만든 작품입니다. '매일신문이 우리를 대신하여 눈이 되겠습니다.'가 주 컨셉인데 아이콘틀의 신문에다가 카메라 렌즈를 입혀보았습니다. 여하튼 장려라도 할 수 있었으면 좋겠네요. ■ 2013/08/01 - [GUI/UI/UX/8月 - August] - [GUI]플랫디자인 - 카메라아이콘 추가적으로 매일신문사 로고 AI파일을 첨부합니다.

[제작가이드]사진엽서 만들기

클리핑마스크와 레이어스타일을 이용하여 포토샵에서 간단하게 POSTCARD(엽서)를 만드는 과정을 알아보겠습니다. 구체적으로 말하자면 사진엽서라 할 수 있겠죠? 01.새로운 캔버스를 생성하고, 단위는 mm또는 cm로 변경하고 내가 원하는 크기로 만든다.(보통 사진엽서의 크기가 가로 140mm 세로 90mm 이라고 합니다.) 그리고, 해상도는 출력을 목적으로 할 수 있기에 300dpi로 한다. 02.캔버스를 생성 했다면, 백그라운드 레이어를 하나 복사한뒤, 트랜스폼(command + T)을 이용하여 크기를 안쪽으로 좁히고, 레이어 스타일에서 stroke를 위와 같이 적용 시킨다.(레이어 스타일 적용법:내가 원하는 레이어를 레이어창에서 더블클릭) 단, 되도록이면 포지션은 Inside로 적용한다. ▲ 레이어 스..

[UI]위메프 앱 리디자인

한때, 미국에서 '그루폰'이라는 소셜커머스가 등장하면서 한국에도 쿠팡에 이어 많은 소셜커머스가 등장하게 되었습니다. 그리고 최근에 많은 소셜커머스 속에서 타사와 다른 적립금이며 배송혜택 등등 메리트 있는 정책을 내놓으며 갑자기 '위메프(we make price)'라는 소셜커머스가 등장하였습니다. (위메프를 광고하는것이 아닙니다.) 이러한 등장속에 제가 앱을 이리저리 살펴보면서 뭔가 아이템은 좋은데 조금만 더 '디자인'이라는 분야에 신경쓴다면 어떨까? 하는 생각속에 개인적인 마음으로 이번 '위메프'라는 앱을 리디자인 해보았습니다. 디자인이라는 것이 답이 없으며 세월이 흐르면 또다시 바뀔 수 있으며 또한, 개개인마다 보는 관점이 다르기에 그저 편하게 보시면 감사하겠습니다. ▲ 리디자인한 '위메프' 앱 아이콘..

[포토샵]스케치 효과내기

포토샵으로 간단(?)하게 스케치 한듯한 효과를 나타내는 방법에 대해서 알아보겠습니다. 개인적으로 필자는 이 방법으로 다양한 느낌을 연출해서 홈페이지에 들어갈 사진이나 간단한 디자인 작업물 등등.. 여기저기에 활용하고 있습니다. (필자의 작업환경은 매킨토쉬 입니다. 따라서 윈도우의 ctrl키와 맥의 command키가 같음을 미리 알립니다.) 01.원하는 사진을 포토샵에 불러 온다.(사진의 종류는 딱히 상관 없다) 02.원본 사진을 하나더 복사한다.(원본레이어를 클릭해 놓은 뒤, command + J) 03.첫번째 복사한 레이어를 흑백으로 변환 시키기 위하여 Image - Adjustments - Desaturate를 적용시켜 사진을 흑백으로 만든다. ▲ 사진이 흑백으로 바뀐 모습 04.다음은 흑백레이어를 ..

Tip/Photoshop 2013.10.14

[UI]iOS7 키패드 리디자인 Ver2.0 iPhone4/4S

지난 8월에 아이폰5용 키패드 리디자인 ver2.0을 포스팅 한적이 있습니다. (아이폰5용 링크 바로가기) 의외로 뜨거운 반응에 이어 제일 많이 들어 오는 요청중 하나가 아이폰 4/4S용을 만들어 달라는 것이였습니다. 더 빠른 시일내에 작업을 할 수도 있었는데 늦어져서 참으로 죄송합니다. ▲ iOS7키패드(왼쪽), 키패드 리디자인(오른쪽/by. 도로독) 왼쪽이 9월에 정식배포된 iOS7의 디자인 입니다. 몇가지 개인적으로 마음에 안드는 부분이 있는데 그중에서 키패드 부분입니다. 실제로 정식 iOS7의 키패드부분 숫자를 터치하면 뒷배경이 원안에서 비치는 효과를 볼 수 있습니다. 물론, 완벽함을 추구하는 애플이 가독성을 고려하며 만든 디자인이라는 생각도 듭니다. ▲ 새로이 추가된 배경 5가지 기존 아이폰5용..

8월을 되돌아보며

유난히도 더웠던 8월 이였던것 같습니다. 지금은 조금씩 날씨가 선선해지고 있네요. 이번 8월은 우연하게 만난 사람들과 많은 소통을 하게된 좋은 계기가 많이 있었습니다. 다시하여금 iOS7에 관심을 가지게 되었고.. 또 플랫디자인에 관해서도 다시 생각하게 되었습니다. 항상 패션에도 그렇듯 '유행'이라는게 존재하며, 그 유행은 다시 과거로 돌아갈 수도, 또는 생각지도 못했던 것들이 유행이 되기도 하는것 같습니다. 디자인에 관한 견해는 정말 끝도 없습니다. 내눈에는 아무리 마음에 들어도 누군가에게는 만족하지 못할수도 있기에 이런것 또한 인연의 일부가 아닌가 싶습니다. 마치 옷깃하나 스쳐도 인연이라는 사람간의 인연처럼 말이죠.. 내가 억지로 노력하지 않아도 그냥 술술 생각나듯 그리는 그런 디자인의 연속이 언젠가..

[포토샵]클리핑 마스크를 활용한, 이미지 틀안에 쉽게 넣기

포토샵에있는 많은 마스크 기능중에 아주 간단하면서도 자주 사용하는 마스크가 있다. 바로, 클리핑 마스크(Clipping Mask) 인데, 이 클리핑 마스크를 활용한다면, 어떠한 이미지도 틀만 만들어 놓으면 그 틀안에 쏙 넣어 버릴 수 있다. 클리핑 마스크 사용법에 대하여 알아보자. 가령, 위의 이미지처럼 스마트폰을 잡고 있는 이미지가 있다고치자. 그리고 그 스마트폰의 화면속에 아래의 배경(어떤것이든 상관 없다)을 다른곳이 아닌 화면속에만 넣는다고 생각해보자. ▲ 클리핑 마스크를 이용하여 넣을 배경 이런씩으로 말이다. 하지만, 만약에 클리핑 마스크를 모르고 있다면, 그저 화면속에 넣을 어떤이미지를 크기를 줄이고 지우개로 지우는등의 행동으로 아주 힘들고 어렵게 화면의 크기에 맞춰서 넣을 것이다. 자.. 이제..

Tip/Photoshop 2013.08.28

[포토샵]Slice툴을 활용한 이미지 쉽게 자르고 분할하기

한번씩 이런 생각을 할수 있다. '아.. 이 식빵을 나는 10등분 하고 싶어.. 어떻게 하면 정확하게 10등분 할 수 있을까?' 물론, 실제로 칼을들고 식빵을 10등분 한다는건 눈대중으로 보며 나름 10등분이라 생각하고 자를 것이다. 하지만 정확한 수치로 따지자면.. 정확하게 10등분이 된건 아니다. 왜냐? 눈대중으로 잘랐기 때문이다. 하지만, 디지털에서는 당연히.. 10등분으로 정확하게 자를 수 있다. 이번 글에서 포토샵을 활용하여 이미지를 슬라이스 하는 방법을 알아보자. 예를들어, 위의그림처럼 아래 탭바의 즐겨찾기 부분을 슬라이스(자르기)한다고 치자. 일단, 즐겨찾기 부분을 포토샵의 Slice Tool을 이용하여 자르기 위해서는 우선적으로 가이드라인이 필요하다.(가이드라인이 없어도 슬라이스가 가능하기..

Tip/Photoshop 2013.08.22

[UI]iOS7 키패드 리디자인 ver2.0

지난번, iOS7 키패드 부분을 리디자인하여 포스팅한적이 있었는데, 우연하게 클리앙의 '무적태권부이님'께서 제 티스토리에 오셔서 원본파일을 요청하셔서 드렸더니 직접 파일을 아이폰에 입히고 작동하는 영상을 보내주셔서 무척이나 놀랬습니다. 물론, 완벽하게 적용되진 않았지만 이번엔 클리앙의 아이포니앙분들과 완벽하게 적용되는 모습을 보고자 이렇게 모든 레이어를 다 분리하여 이번 iOS7 키패드 리디자인 ver2.0을 만들게 되었습니다. 자세한 설명은 아래 내용을 보며 설명 드리겠습니다. ▲ 전체적인 모습 ver1.0과 크게 다른 부분은 없으며, 상단 캐리어바와 하단 탭바는 기존 iOS7베타 디자인을 적용하였습니다. 그리고 키패드 부분 눌렸을때의 이미지(숫자5)에서 흰색의 아웃글로우가 적용 되었으며, 원의 가운데..

반응형