본문 바로가기

분류 전체보기363

적응형 홈페이지와 반응형 홈페이지의 제작비용 및 제작방식에 대해 알려드립니다. 적응형과 반응형 홈페이지 차이점을 모르시는 분들을 위해 간략히 설명하고 본론으로 넘어가겠습니다. ​1. 모바일 최적화 작업 - 적응형과 반응형 과거 10여 년 전에는 홈페이지를 보는 방법이 커다란 화면의 PC 뿐이었지만, 스마트폰이 등장하면서 홈페이지를 화면이 작은 스마트폰에서도 보게 되었죠. PC의 커다란 모니터에 맞춰 제작된 홈페이지를 스마트폰에서 확대하여 보는 게 불편했던 소비자들의 편의를 위해 기업들은 모바일 홈페이지를 추가로 제작하여 서비스하게 됩니다. ​ 이후 홈페이지 제작은 PC와 모바일 두 가지 홈페이지를 제작하는 것이 일반적인 방식으로 변화하게 되며 우리는 이렇게 기기에 맞게 따로따로 홈페이지를 추가 제작하는 모바일 최적화 작업을 적응형이라 부릅니다. ​ 반응형은 기기에 맞게 추가 제작하.. 2020. 10. 10.
크몽, 오투잡, 라우드소싱과 같은 디자인판매 사이트에 대한 제 생각입니다. 10년 전 디자이너 모임 술자리에서 저가 홈페이지 제작업체가 디자인 시장에 미치는 영향에 대해 이야기를 한 적이 있는데 그때가 생각이 나네요.^^ ​ 제대로 된 홈페이지를 만들려면 여러 분야의 고급인력들이 많은 시간을 할애하여 만들어야 하는데, 30만원 혹은 10만원 홈페이지라는 가격을 내세워 싸구려 홈페이지를 그냥 찍어내는 홈페이지 공장들 때문에 우리 디자이너의 능력 가치가 떨어진다. 이런 가격경쟁시장에서는 디자이너들이 퀄리티가 아닌 단가와 시간에 맞춰 작업을 진행하게 될 것이며, 이는 당연히 홈페이지 시장이 전반적으로 후퇴하게 되는 결과가 올 것이다.라는 이야기를 했었죠. 당시 그 자리에 모인 디자이너들 대부분이 이 주제에 대해 공감하고 있었으며, 심지어 저가 업체들을 심하게 욕하는 사람들도 있었습니.. 2020. 9. 25.
해외 유명 브랜드 로고에서 사용한 폰트 입니다. 이번 영상에서는 해외 유명 브랜드 로고에서 사용한 폰트 70개를 소개하고 있습니다. 중간에 LG 로고도 살짝 보이네요 ^^ 해당 영상은 [logo_fonts] 인스타그램에서 참조하였기 때문에 아래 인스타그램으로 접속하시면 더 많은 사례들을 확인하실 수 있습니다. 바로가기 : www.instagram.com/logo_fonts/ 끝으로 이번에 오픈한 [All Design Ideas] 블로그도 함께 첨부 해드립니다. 바로가기 : alldesignideas.com/ 영어라고 겁먹지 마세요~ 우리에겐 구글 번역이 있으니까요~ 2020. 9. 24.
css 단위 em 과 rem 정리 - 드림코딩 엘리님이 재밌게 알려드립니다. 2007년도 부터 이바닥에 들어서고 css 단위는 px, % 이 두가지로 퉁치면서 문제없이 잘쓰고 있었는데요, 어느날 반응형 홈페이지라는 말이 나오더니 그에 맞게 em, rem, vh, vw 등 여러가지 단위들이 늘어 났습니다. 세상이 변함에 따라 공부할 것이 계속 늘어나니 심심하지 않아 좋네요 ^^; 이중 em 과 rem에 대해 드림코딩 엘리님께서 재미있게 콘텐츠를 잘 만들어주셨습니다. em 과 rem가 헷갈리시는 분들은 참고해보세요~ 2020. 9. 23.
어도비 디멘션 - 프러덕트, 목업 등 3D 디자인에 유용한 툴입니다. 어도비사에서 제공하는 그래픽툴은 포토샵, 일러스트, 인디자인 이외에도 수많은 툴이 있습니다. 디멘션 (Adobe Dimension) 은 3D그래픽을 만들어주는 크리에이티브 툴로 2017년도에 어도비 크리에이티브 클라우드 제품군의 본격적인 멤버가 됩니다. 현재 2020년도 까지 많은 발전와 업데이트가 있었지만 사실 타사의 유명한 3D그래픽 툴보다는 기능면에서 많이 뒤쳐저있긴 합니다. 하지만 기존의 포토샵, 일러스트에서 제공하던 3D편집 기능보다는 훨씬 뛰어나고 기존의 3D 그래픽 툴보다는 사용법이 아주 간단하기 때문에 생각보다 많은 분들이 디멘션 툴을 활용하고 있으며, 특히 간단한 목업디자인을 만드는데 아주 유용하고 사용되고 있습니다. 3D 디자인을 시작하고 싶지만 어렵고 높은 진입장벽 때문에 망설이고 계.. 2020. 9. 17.
웹기획부터 제작까지 실무에서 사용하는 업무용어 정리입니다. 업무용어는 협업에 있어서 팀원들간에 소통에 꼭 요한 요소라 반드시 숙지하시는 것이 좋습니다. 물론 회사에 입사를 하면 선배님들이 잘 알려줄테고 업무를 하다보면 자연스럽게 익히겠지만, 센스있는 신입사원이 되고 싶다면 미리 숙지하는 것이 좋을 것입니다. 아래 영상은 IT 웹 실무에서 사용하는 용어정리 영상입니다. 참고로 조직마다 조금씩 용어의 차이가 있을 수 있습니다. 따라서 영상마다 용어의 차이가 있기도 한데요, 틀리고 맞고의 문제가 아니므로 모두 알아두시면 좋을 것 입니다. 특히 와이어프레임과 스토리보드, 목업과 프로토타입의 경계가 업체마다 좀 다른 것 같은데요 아래 링크 참고해보세요~ https://yslab.kr/74 [웹 기획] 화면 설계 용어 - 와이어프레임, 스토리보드, 프로토타입의 차이점 📌 .. 2020. 9. 15.
웹 기획자를 위한 서비스 및 관련 툴을 정리하였습니다. 세균무기님께서 올려주신 서비스 기획자를 위한 툴 모음입니다. 몇가지 추천 툴 서비스를 올려주신 것이 아니라 쓸만한 툴은 모두 정리하여 올려주셨습니다. 서비스 기획자 뿐만 아니라 일반회사원, 학생들에게도 유용한 툴이 많이 있는 것 같으니 한번쯤 시간내시어 참고하시고 활용해보시는 것도 좋을 것 같습니다. germweapon.tistory.com/m/391 서비스 기획자를 위한 툴 IT서비스 기획자로 일하며 사용하는 툴들이 너무 많다. 그리고 언젠가부터 툴을 사용할 줄 아는 것이 경쟁력이 되어버렸다. 채용 조건에 이런저런 툴들을 올라오는 것을 보면 말이다. 어쨌든 필� germweapon.tistory.com 2020. 9. 14.
캘리폰트에서 캘리그라피 만들기 - 상업용, 납품용 모두 사용 가능 https://callifont.com/ 캘리폰트 한글 Archives - 캘리폰트 한글 Archives - 캘리폰트 callifont.com 캘리폰트에서는 TTF 나 OTF 와 같은 폰트파일(프로그램) 을 제공하는 것이 아니라 아래와 같이 한글 자음과 모음의 이미지를 제공하는 사이트입니다. 이는 서체프로그램을 이용하여 타이핑하는 방식보다는 훨씬 번거롭고 불편하지만 로고, 간판과 같이 유니크한 디자인을 요하는 작업에서는 아주 유용하게 활용하실 수 있을 것 입니다. 또한 상업용, 납품용 모두 이용가능하기 때문에 홈페이지,로고 제작업체에서도 사용 하실 수 있습니다. 이렇게 라이선스 규정이 상당히 자유롭지만 몇가지 금기사항이 있으므로 아래 규정을 확인하시어 예상치 못한 불이익을 받는 일이 없도록 주의 바랍니다.. 2020. 9. 12.
자바스크립트 없이 html과 css로 만드는 슬라이드 배너 강좌 이번 영상은 실무에서 활용하기에는 좀 무리가 있지만 html과 css 를 보다 깊게 공부하는데 도움이 될 것 같습니다. input의 radio속성을 활용하여 슬라이드를 선택적으로 보여지게 하였으며 슬라이드배너가 부드럽게 움직이는 효과는 css의 transition을 이용하였습니다. 그럼 아래 코남님의 재밌고 센스있는 강좌영상을 확인해보세요~ 참고로 보시면 아시겠지만 코남님의 강좌영상 센스가 구독버튼을 자연스럽게 누르게 할 것입니다. 사용된 예제파일은 아래 블로그 링크를 통해 이동하셔서 다운받으 실 수 있습니다. https://blog.naver.com/co-nam/222084570760 2020. 9. 11.
노마드코더 니꼴라스가 추천하는 IT 영화입니다. 노마드코더 니꼴라스가 추천하는 IT 영화입니다. IT업에 종사하시는 분들이라면 또 다른 재미를 찾아볼 수 있을거라 기대합니다. ​ 1. Pirate Bay Away from Keyboard (더 파이러트 베이: 키보드를 떠나서) 한줄요약: 개방된 인터넷을 위한 전쟁(!?) 예고편: https://youtu.be/G6qcJt2NPY8 ​ 2. Citizenfour (시티즌포) 한줄요약: 스노든의 미국 감시 프로그램 폭로 과정 예고편: https://youtu.be/XiGwAvd5mvM ​ 3. Zerodays (제로 데이즈) 한줄요약: 어떻게 컴퓨터 바이러스가 이란 핵시설을 파괴한건가 예고편: https://youtu.be/C8lj45IL5J4 ​ 4. The Internet's Own Boy (누가 애런.. 2020. 9. 10.
2020 텍스처 질감 효과 Best 10 입니다. - Envato 가벼운 디자인을 보다 풍성하게 하는 요소로 텍스처 효과는 많이 활용되고 있습니다. 포토샵 제작물에 텍스처를 추가하는 것만으로도 풍부한 디테일과 복잡한 이미지가 생성되며, 이는 worlkflow를 향상시키고 놀라운 결과 보여주기도 합니다. 아래 영상은 Envato 에서 알려주는 2020 텍스쳐 질감 효과 Best 10 입니다. 디자이너라면 가볍게 한번 시청해주세요~ FEATURED ITEMS Number 10. (0:43) 12 Texture Spray Photoshop Brushes by M-e-f https://elements.envato.com/12-texture-spray-photoshop-brushes-6NS5FM?utm_campaign=elements_social_eyt_Oy7j0SKW5L4&u.. 2020. 9. 9.
일러스트를 이용하여 물결, 파도, 얼룩 모양 만들기 일러스트레이터 이펙트 효과에 있는 기능 중 지그재그를 활용하면 물결, 파도와 같은 모양의 선이나 면을 쉽게 만드실 수 있습니다. 포토샵에서도 가능하긴 하지만 백터기반의 일러스트레이터에서 만드는 것이 훨씬 더 깔끔할 것 입니다. 그럼 아래 영상을 참고 해 보세요. 자막이 필요하신 분들은 아래 링크 참고해보세요~ https://designup3.tistory.com/pages/%ED%95%B4%EC%99%B8-%EC%9C%A0%ED%8A%9C%EB%B8%8C-%EC%98%81%EC%83%81-%EC%9E%90%EB%8F%99%EB%B2%88%EC%97%AD-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0 해외 유튜브 영상 자동번역 설정하기 1. 해외 유튜브 영상에서 자막 아이콘을 눌러주세요.. 2020. 9. 9.
디자이너들에게 유용한 무료 디자인 목업 소스 브런치에서 활동중인 비범한츈님께서 정성스럽게 선별 해주신 2020년 9월 주목할만한 무료 디자인 목업 소스 입니다. 비범한츈님 브런치에는 이밖에도 디자이너들에게 유용한 글들을 많이 올려주셨습니다. 브런치를 이용하시는 디자이너님들은 구독하기를 해주시면 더욱 도움이 될 것 같습니다. https://brunch.co.kr/@forchoon/417 주목할만한 무료 디자인 목업 소스 (2020.9월) 주목할만한 무료 디자인 목업 소스 모음(23번째 버전) | 2020년 9월 무료 디자인 목업 소스 스무 세번째 버전을 공유합니다! 8월은 본의아니게 일이 많아서 패스하게 되었네요 ㅠ 미리보기가 안 뜨� brunch.co.kr 2020. 9. 8.
쿠키 수집에 동의해야 하나요? 웹사이트에서 요구하는 쿠키에 대해 알아봅시다. 웹사이트를 둘어보다보면 가끔씩 '쿠키 수집에 동의하십시오' 라는 문구를 볼 수가 있습니다. 왠지 동의하라고 하면 의심부터 생기기마련인데요, 이것을 동의해야 하는지 하지 말아야하는지 궁금하실 것입니다. 결론부터 말씀드리면 해당 사이트가 본인이 자주 이용하는 사이트라면 하는 것이 좋습니다. 하지만 잠깐 잠깐 방문하는 사이트거나 처음 방문하는 사이트라면 거절하시는 것을 추천드립니다. 너무 당연한 말인가요 ? ㅎㅎㅎ 쿠키는 사용자의 정보를 수집하여 웹사이트를 보다 편리하게 사용하기 위해 만들어진 기능입니다. 보통의 회원가입정보수집과 쿠키정보수집과 다른점은 회원가입정보의 경우에는 사용자가 로그인을 해야만 사이트에서 이를 인지하고 이를 활용할 수가 있습니다. 사이트에 로그인을 해야만 장바구니에서 구매내역을 확인 할.. 2020. 9. 5.
일반인들도 코딩없이 앱,홈페이지 개발이 가능할까? 과연 개발자들의 일자리는 어떻게 될까? 디자인 AI에 포스팅에 이어서 이번에는 코딩 자동화 서비스에 관련 된 동영상을 소개 해드리려 합니다. 코딩없이 웹사이트를 구축하는 툴/서비스로는 이미 1997년도 드림위버나 나모웹에디터와 같은 툴이 있었습니다. 하지만 이 툴을 이용한다 하더라도 코딩 지식없이 제대로 된 사이트를 구축하는건 사실상 불가능했었죠. 이후 10년이 넘게 지난 지금의 2020년는 상황이 많이 달라졌습니다. 물론 아직까지는 내가 원하는 홈페이지나 앱을 코딩지식 없이 만든다는 건 불가능하지만 실사용이 가능한 수준의 결과물을 만드는 수준까지는 도달했으며, 이미 많은 사용자들이 이 서비스의 편리함을 누리고 있습니다. 대표적인 예로는 유튜브광고로 한번쯤은 보셨을 윅스(WIX) 웹빌더 서비스가 있습니다. 광고의 슬로건도 "일반인들도 쉽게 만.. 2020. 9. 3.

티스토리툴바