솔루션 꿀팁&길라잡이

디자인 모드 기본 사용방법

탈퇴한 회원
조회수 844

그리드 시스템 이해하기

왼쪽 이미지와 오른쪽 이미지 중 어떤 것이 정리가 잘 되어 보이고 컨텐츠가 잘 보이나요?거의 모든 사람은 오른쪽을 택할 것입니다. 이는 간단한 그리드 시스템의 예시입니다.

그리드 시스템은 제일 처음 건축에서 개발단계에서 구획을 나눌 때 사용되었고 그후 타이포그래피에서 활용되다가 1930년경 신문잡지등에서 기사, 사진 등 각 컨텐츠등을 효율적으로 구성하기 위해사용되었습니다.

메이크디에서도 잘 보이는 레이아웃을 쉽고 빠르게 구성할 수 있도록 그리드 시스템이 도입되었습니다. 아임웹으로 제작된 사이트는 12칼럼 그리드 구조로 만들어지며 객체의 이동이나 크기 조정은 전체 폭의 1/12(약 8.33%) 만큼씩만 조정됩니다.

얼핏 과도하게 제한되는 것 같지만 대부분의 상황에서 적절한 레이아웃을 만들 수 있는 시스템입니다.

드래그로 이동

디자인 모드에서 가장 많이 쓰이는 것 중 하나는 드래그입니다. 위젯을 원하는 위치로 이동을 시킬때 사용합니다.

대상을 좌/우로 이동시키는 것 뿐 아니라 상/하로도 이동시킬 수 있습니다. 

참고: 위젯이 하나만 있을 땐 이동할 수 없습니다. 좌우로 이동할 때 같은 선상에 위젯이 하나만 있을 때도 이동할 수 없습니다.

드래그로 크기 조정

위젯과 위젯 사이를 드래그하면 크기를 조정할 수 있습니다.

이미지 위젯, 지도 위젯, 여백 위젯과 같은 일부 위젯은 이미지 하단 가장자리를 드래그하여 크기 조정이 가능합니다. 어떠한 크기로 조정하더라도 비율은 자동으로 유지됩니다.

참고: 이동과 마찬가지로 좌우 크기 조정은 위젯이 단독으로 존재할 때 사용할 수 없습니다. 하나의위젯을 단독으로 작게 표현하고자 할 땐 여백 위젯을 추가하여 조정하시면 됩니다.

수직 크기 조정은 그리드 단위가 아닌 픽셀 단위로 세밀하게 조정할 수 있습니다.

마우스 오른쪽 버튼

디자인 모드를 완벽하게 사용하려면 마우스 오른쪽 버튼을 사용하셔야 합니다. 각 위젯이나 섹션,상단 및 하단은 마우스 오른쪽 버튼을 눌러 설정화면에 진입하거나 각종 옵션을 빠르게 사용 할 수있습니다.

참고: 각 위젯이나 섹션 오른쪽 상단에서  아이콘을 눌러도 같은 효과를 낼 수 있지만 편의성 측면에서 마우스 오른쪽 버튼 사용을 권장합니다.

복사 및 붙여넣기

컴퓨터의 파일 관리자에서 파일을 복사, 붙여넣기 하듯 위젯이나 섹션의 복사 및 붙여넣기가 지원됩 니다. 복사를 원하는 위젯이나 섹션에 마우스를 올린 후 오른쪽 버튼을 이용해 복사를 누른 후 같은 페이지 뿐 아니라 다른 페이지에도 붙여넣을 수 있습니다. (복사 및 붙여넣기는 단축키로는 지원하 지 않습니다)

즉시 저장

디자인 모드는 대부분의 설정이 즉시 저장됩니다. 따로 저장 버튼을 누르지 않아도 됩니다. 예를 들 어 이미지 설명을 변경하고 바로 닫기를 눌러도 반영됩니다.

이는 불필요한 과정 없이 최대한 빠르게 원하는 결과물을 만들 수 있도록 의도된 것입니다.



최고의 파트너


메이크디와 파트너쉽을 맺은 

고객사에게 끊임없는 평생 

유지보수, 처음부터 끝까지

정성을 다하여 함께합니다.

솔루션 제공서비스


코딩을 몰라도, 포토샵을 몰라도!

클릭과 드래그만으로 

손쉽게 디자인을 관리 

수정할수 있습니다.

실시간알림서비스


새로운 소식 및 정보가 있을때 

스마트폰으로 알림이 즉시 발송

실시간으로 쌍방향소통이 가능하여 

스마트한 관리가 가능합니다.

자동업그레이드


지속적인 연구개발로

시스템의 오류를 처리하고, 

웹,앱환경에 최적화하기 위해 

자동 업그레이드를 지원

공식제휴사