틀토론:정보상자

디자인 개편 제안[원본 편집]

이 문단은 완료된 토론으로, 보존중입니다. 특별한 사유가 없는 한 수정하지 말아주십시오.
Ledibug-Discussion.png

우측의 펼치기 버튼을 눌러 내용을 볼 수 있습니다.

틀토론:책 정보에서 Text-Justify님이 해주신 말씀을 듣고, 어떠한 디자인이 위키에 어울리면서 알아보기 좋은지에 대해 고민해봤습니다. 그 결과물로 나온 사용자:Pika/새 정보상자가 위키 디자인 기조에 어울리지 않을까라고 생각하여 올려봅니다. --Pika (토론) 2022년 6월 3일 (금) 02:22 (KST)

  1. 전체적으로 테두리를 확 줄이고, 눈에 띄도록 정보 틀 시작/끝, 주제에 2px 테두리를 사용하였습니다. 또한, 제목과 그림이 한 칸에 있는 것처럼 보이도록 했습니다.
  2. 바탕색/글자색을 주제 칸에만 적용하도록 하였습니다.
Ledibug-Labin-Head-Opinion.png의견 클래스명을 기존대로 infobox로 했으면 좋겠습니다. .info는 .table .img .image 처럼 너무 모호한 클래스 이름이며 다른 클래스와 겹칠 우려가 있습니다. 아니면 table.info 처럼 좀 더 명시적으로 css를 작성해야 할 것 같습니다. 蒼天 토론 기여 2022년 6월 3일 (금) 08:32 (KST)
Ledibug-Labin-Head-Opinion.png의견 라운딩 처리는 유지하면 좋겠습니다 --27.126.20.92 2022년 6월 3일 (금) 08:40 (KST)
1.위키 디자인상 2px 테두리가 쓰이는 곳이 흔치 않아서 튀지 않나 싶습니다.
2.제목과 그림이 한 칸에 있는 것처럼 연출되니 제목칸에 억지로 사진을 끼워넣은 듯도 합니다.
정보상자만 보면 나쁘지 않다고 할 수도 있겠지만 사이트 스킨과의 일관성면에서는 기존이 나을 것으로 생각합니다. 그리고 해당 토론처럼 스킨 디자인 선에서 다루는 것이 적합하다고 생각합니다. --Text-Justify (메시지) 2022년 6월 3일 (금) 09:00 (KST)


  1. info 및 styles.css 사용은 제작을 쉽게 하기 위함입니다. 새 디자인이 적용된다면 common.css를 변경할 예정입니다.
  2. 2px 테두리가 흔치는 않지만, 대다수가 1px를 사용하기 때문에 오히려 강조하는 효과를 줄 수 있다고 생각합니다. 모두가 1px라면 문서가 평면적이여서 보기가 더 어렵지 않을까라는 생각이 듭니다.
  3. 제목과 그림 사이에 줄이 없는 것은 호불호가 갈릴 수 있다고 생각하기 때문에 이건 다수의 의견을 따르겠습니다.

추가로 깜빡하고 언급하지 않은 변경점이 있습니다. border-radius가 빠지고, 의미가 덜한 "XX 정보" 주제 칸이 빠집니다. --Pika (토론) 2022년 6월 4일 (토) 00:46 (KST)

라운딩 처리에 관해서는요??--27.126.20.92 2022년 6월 4일 (토) 18:36 (KST)
그게 border-radius입니다. --Liebesfreud (공개 기록·토론) 2022년 6월 4일 (토) 18:39 (KST)
제목과 그림간 같은 회색이라는 점만큼은 재고가 필요할 것 같습니다. 하부 표에서 각 범주를 다루는 칸이 회색으로 처리됩니다만 제목과 그림이 모두 회색 배경으로 처리되면 내용은 없는 채로 범주만 2열로 확장된 모양이 됩니다.
그리고 과연 정보상자가 단독적인 2px 테두리로 강조될 필요가 있을지에 대해서는 의문이 있습니다. 기본적으로 줄글이 나열되는 문서 영역에 해당 토론에서의 언급처럼 다른 레이아웃으로 나뉜다면 사용자는 충분히 이를 구분할 수 있을 것으로 판단합니다. 더불어 보편적인 디자인 규율상 1px을 더하는 것으로 단독적으로 구분하는 형태가 다른 사례를 봐도 얼마나 있을지 모르겠습니다. --Text-Justify (메시지) 2022년 6월 5일 (일) 19:42 (KST)
border-radius는 유지했으면 좋겠습니다 --Alzip (토론) 2022년 6월 6일 (월) 12:17 (KST)
리브레 위키에만 둥근 테두리가 적용되었던게 장점이었던 같습니다. 蒼天 토론 기여 2022년 6월 6일 (월) 12:46 (KST)
Pika님 연습장 보니까 둥근 테두리가 없어져도 티가 잘 안나네요. 蒼天 토론 기여 2022년 6월 8일 (수) 19:11 (KST)

좀 더 생각한 결과, 1px도 충분할 것 같네요. 제목과 그림이 같은 배경색을 사용하는 것에 대한 문제제기도 어느 정도 동의합니다. 하지만 그림을 더 잘 보이게 하려면 배경색이 있어야 한다고 생각하기 때문에, 제목 칸과 주제칸의 색상을 바꾸는 것으로 해결하려고 합니다. (색깔은 아무거나 넣었습니다.) --Pika (토론) 2022년 6월 6일 (월) 14:34 (KST)

제목 칸의 색과 구분되니 더 나아 보인다고 생각합니다. 다만 제 전달에 미흡한 점이 있었던 것 같아 더하자면, 하부 표 내용상의 범주와 사진 부분의 범주가 같은 색으로 처리되니 사진이 범주와 같은 위계에 놓인 채 2열로 확장되는(병합된) 모양새라는 점에 문제가 있어 보인다는 의견이었습니다. --Text-Justify (메시지) 2022년 6월 6일 (월) 16:19 (KST)

둥근 테두리에 대한 의견을 내주셔서 말입니다만, 리버티 스킨 2.0이 예정된 상황에서 사이트 디자인상 어느 정도 변화가 있을 가능성을 염두에 두어서도 나쁘지 않을 것 같습니다. 일관성과 어울림을 생각하자면 차기 업데이트 후에 디자인을 다시 다듬어야 할 가능성도 생각해야 할 듯합니다. --Text-Justify (메시지) 2022년 6월 6일 (월) 16:34 (KST)

개편의 이유에 위키 디자인간의 어울림이 들어간다면 개편안의 방향이 기존 대비 얼마나 목적에 부합할지를 평가 기준으로 놓고 봐야 할 것 같습니다. 사실 이를 기준으로 놓고 본다면 저는 보수적인 입장입니다. --Text-Justify (메시지) 2022년 6월 6일 (월) 16:40 (KST)
나름의 구축된 아이덴티티면에서도 그렇습니다. --Text-Justify (메시지) 2022년 6월 6일 (월) 16:42 (KST)
리버티 2.0이 적용된다 하더라도 해당 프로젝트의 목적은 프레임워크 변경이지 디자인 변경은 아니기 때문에 전체적인 디자인은 변하지 않습니다. 지금 위키방 정도 느낌이려나요 --Zlzleking (대화|편집 이력) 2022년 6월 7일 (화) 09:30 (KST)
근데 어째 새 미디어위키가 하는 일 보면 이것도 올해 안에 보기 어렵지 않을까 싶습니다. 위키방이랑 코드베이스를 좀 공유하려고 계획한 건데 지금 상태면 어차피 새로 짜야 하는 건 같거든요. --Zlzleking (대화|편집 이력) 2022년 6월 7일 (화) 09:31 (KST)

디자인은 (제가 해석한) 현관의 디자인을 표준으로 삼았습니다. 현관은 사이트의 대표이자 시작점이니까요.

  1. 한눈에 봐서 구분되면 굳이 구분선을 넣지 않는다.
  2. 구분할 필요가 있을 때에는 가로선만 넣는다.

이는 여러 목록 틀이나 표 틀에도 반영되어 있습니다. ({{곡 목록}}, {{가사}}, {{등장인물 목록}} 등) 따라서 개편 디자인이 좀 더 낫다는 생각입니다. --Pika (토론) 2022년 6월 8일 (수) 19:17 (KST)

Ledibug-Labin-Head-Opinion.png의견 맨 아랫줄은 지웠으면 좋겠습니다. 아 구분이 안되려나요.蒼天 토론 기여 2022년 6월 8일 (수) 19:26 (KST)

진행을 한다면 '굳이 넣지 않는다'라는 기준은 어떻게 적용되었는지 재고해야 할 것 같습니다. 현 상태를 보면 상부에서는 영역이 면으로 구분되었다가 하부로 가서는 선으로 구분됩니다. 결국 통일성은 흐트러집니다.
그림 칸은 정보의 전달을 생각해서라도 배경색을 넣지 않는 방향이 적합할 듯합니다. 예를 들어 배경이 투명한 캐릭터나 로고 이미지를 넣는다고 치면 배경색이 마치 공식 색상인 것처럼 전달될 가능성도 생각해야 하지 않을까요. 앞서 말했듯 위계도 맞아떨어지지 않고요. --Text-Justify (메시지) 2022년 6월 9일 (목) 22:21 (KST)

하부 '음악 활동' 칸과 제목 표시줄 배경색은 통일되리라 여깁니다. --Text-Justify (메시지) 2022년 6월 9일 (목) 22:21 (KST)

몇 가지 시안을 만들어봤습니다.

  • 파일:2022-06-09 정보상자 시안 1-2.png
    시안 1-2는 기존 정보상자의 색상을 적용한 모습입니다. 제안된 정보상자의 회색은 어디에서 유래되었는지 근원을 찾기 어려웠습니다. 충분히 밝지만 배경색(흰색)과의 대비가 너무 낮다는 점은 충분한 구분감을 주지 못한 채 모호하게 보입니다. 독자적인 색상을 적용하는 대신 이미 스킨에서 사용되고 있는 색을 선택하는 것은 일관적이면서 보다 안전할지도 모릅니다.

다만 이 시안을 만든 것이 개편 여부 자체에 대한 방향을 정했거나 추진하고자 하는 의도는 아님을 밝힙니다. --Text-Justify (메시지) 2022년 6월 9일 (목) 22:26 (KST)

스킨에서 유래된 회색은 전체 단독 배경색으로 쓰여 실제 적용은 부적합하지 않을까 생각하고 있습니다. --Text-Justify (메시지) 2022년 6월 9일 (목) 22:40 (KST)
만들어 놓고 의견을 낸다면 항목칸 배경색 구분은 없이 가로선만 있는 쪽이 더 현대적인 느낌을 줄 수 있으리라 판단합니다. --Text-Justify (메시지) 2022년 6월 9일 (목) 22:55 (KST)

Text-Justify님 말씀에 대한 답변입니다. --Pika (토론) 2022년 6월 10일 (금) 00:01 (KST)

  1. 원래 제목 칸 밑에 선을 넣는 것과 주제 칸에도 선을 빼는 것 두 가지를 고려하려고 했으나 개인적인 사정으로 못했습니다.
  2. 색상은 미디어위키:Common.css에 정의되었지만 실제로는 적용되지 않은 색깔을 썼던 것입니다. 색상은 더 나은 것이 있다면 마다하지 않고 사용할 생각입니다.
  3. 간혹 투명한 로고 파일이 있어서 배경색이 없으면 파일이 보이지 않는 경우가 있어서 이를 고려한 것이었는데, 좀 더 생각해봐야겠습니다.