候選人頁面各縣市的呈現 about councilor-voter-guide HOT 48 CLOSED

附圖是調整參數後用span6 + margin:0.6410255%;調整結果
（這數值是Bootstrap2給的，Responsive會在width:960~1200處變成單邊排列）

from councilor-voter-guide.

第二種呈現方式（PC和手機不同）

如果這方案可行，請給我參數去補"鄉鎮數"的部份
例如：有多少鄉鎮、有多少議員之類的資訊

from councilor-voter-guide.

這是用PS做的候選人頁面

from councilor-voter-guide.

@mireille09 的應該是議員席次
下方是各區候選人人數：

from councilor-voter-guide.

謝謝 @thewayiam 提供完整應選人數

from councilor-voter-guide.

https://github.com/kiang/elections/tree/master/Console/Command/data/2014_areas

我把選舉黃頁上面各種選舉類型的資料匯出了，欄位說明如下：
id - 選舉黃頁uuid
url - 選舉黃頁網址
election - 選區
quota - 應選人數
quota_woman - 婦女保障名額
population - 人口
population_electors - 選舉人數量（滿 20 歲）
areas - 行政區 (
id - 選舉黃頁uuid
name - 名稱
ivid - https://github.com/g0v/twgeojson 的行政區編號
code - 主計處的行政區編號
url - 選舉黃頁網址
)

from councilor-voter-guide.

點一下縣市會出現右邊選區
不過我只會PS不會程式

from councilor-voter-guide.

我很喜歡這樣的設計，但這設計相當於兩層的選單
網站本身的架構不是合用這種
因為縣市頁面不適合再去顯示鄉鎮的詳細資料

目前進度如圖

如果有嚴格要求要正方形的話我會再用用看

from councilor-voter-guide.

@s890081tonyhsu ++
美美的！

兩個小建議：
字跟方塊邊界的 padding稍微加大一點點
席次改為參選人數，可能比較不會誤會

from councilor-voter-guide.

最終截圖*2

如果今天(11/13)十二點以前沒有特別的想法我叫要送request上去囉

隨手附上responsive for mobile、responsive for tablet共兩張

from councilor-voter-guide.

@s890081tonyhsu ++ @mireille09 ++

from councilor-voter-guide.

@s890081tonyhsu 很美歐~
建議方塊上下距離可以小一點. 縣市的選區與席次有沒有辦法放在一行呢?
最後是選區能否有完整市鄉鎮與選區序
有些選區含蓋鄉鎮很多...這比較麻煩一點

from councilor-voter-guide.

@mireille09

1. 結果如圖一
2. 選區和參選人數在三個一列或五個一列的時候會相互擠到
3. 你看到的名稱就是從資料庫直接拿出來的結果（參見圖二，排的不整齊的原因是資料長度不一，仍在想方法）

圖一

圖二

from councilor-voter-guide.

@s890081tonyhsu 了解 謝謝你 速度真快
選區字太多能不能把框框也變大呢?
資料庫的選區可以直接修改嗎? 可以的話我就去弄

from councilor-voter-guide.

或許是不錯的想法，但瀏覽器寬度是未知數
所以標題會不會從一行變成兩行這點我也不知道
就算可以預估得到，如果遇到下面這筆資料就會出包

A, B, C, D, E：單欄、F, G, H：雙欄

排版表格

先謝謝你的想法贊助
三欄和五欄的高度我好像有方法可解（剛翻文件）

from councilor-voter-guide.

@s890081tonyhsu+ 正方形或長方形(俗稱黃金比例)應該都會很美
接下來看看顏色能否小變化, 真不好意思一直麻煩你~
選區的問題我在想想看, 有些選區鄉鎮超級多, 字也會超多

from councilor-voter-guide.

顏色變化請給我色單（網址：http://paletton.com/）
在拉出適合的色單時，複製網址給我（有uid的）
如果要弄新的色單請記得清除uid在重連即可

顏色的部份我真的不熟悉，如果可以還請你多指教ww

from councilor-voter-guide.

http://paletton.com/#uid=33i0u0ko0K+dGUmjjPFsPFTAyvi
我用PS顏色代碼輸入的, 三角形比較活潑, 四角型也不錯, 有win8感
顏色只是要讓呈現出來的結果不要太單調而已, 我也是新手.
文字是用白色的話, 基本上不要用太亮的顏色就好了 辛苦了

from councilor-voter-guide.

@thewayiam 這Issue結果我已經弄成 #42 ，但因為操作不當所以close掉了，有空請幫我看一下

from councilor-voter-guide.

收到，我以為你想要再改一下XD

from councilor-voter-guide.

Merged
雖然很漂亮，但感覺還是有點難找到自己的縣市

from councilor-voter-guide.

@thewayiam
很漂亮喔~
我會建議顏色可能用兩個相似色系就可以了, 上面那種是淺一點的, 下面那種是深一點的,
不好意思我比較龜毛一點, 縣市文字的陰影顏色可以深一點嗎? 或者字大一點
縣市可不可以重新排列順序呢?
直轄市、台灣省北中南東這樣排下來

from councilor-voter-guide.

我整理一下

顏色可能用兩個相似色系就可以了, 上面那種是淺一點的, 下面那種是深一點的

這一點恐怕還要再討論，因為這是動態排列的（mobile一行一個、tablet一行三個、desktop一行五個）

縣市文字的陰影顏色可以深一點嗎? 或者字大一點

如果可以，可以給數據是最快解法

大小單位給px
陰影請給顏色、不透明度、角度、間距、尺寸

縣市可不可以重新排列順序呢?
直轄市、台灣省北中南東這樣排下來

這點是資料提供方的問題，如果他們有排列過的話應該可以

from councilor-voter-guide.

微軟正黑體 字型大小24
陰影- 黑色(色彩增值), 不透明75%, 角度 120, 間距 2像素, 尺寸 5像素

基本上兩種顏色看起來叫清爽, 一行3個或5個就是交錯也是耐看的
我是覺得色相不要對比太大這樣

from councilor-voter-guide.

縣市排列順序問題
目前縣市越來越完整
之後我可以試著直接寫死在 html，不用再從 db輸出

from councilor-voter-guide.

如果這東西要Open到國外的話，還是幫縣市建立個ID，用ID排列吧....

from councilor-voter-guide.

效果如圖
網頁沒有色彩增值，所以黑色就黑色吧

from councilor-voter-guide.

@s890081tonyhsu ++
很美喔就是這感覺~~
我注意到選區跟參選人數列出來是排在中間那行
不知道能不能放在下面那一行呢?

from councilor-voter-guide.

@s890081tonyhsu : 兩層都用 bluegreen哦
@mireille09 : 空行感覺如下，目前是空一行，這樣的感覺OK嗎？不知道為什麼 #00CCCC變得比較深？?

from councilor-voter-guide.

@thewayiam ++ 不錯喔~ 可以空兩行看看嗎
色表是繪圖軟體的, 跟網頁計算的可能會有不同吧
陰影的不透明度可以調成50%看看嗎?
網頁顏色可以試試看用這個調 http://www.huecode.com/
ex: 輸入00cccc, 再調亮一點, 會變成02e8e8之類的東西

from councilor-voter-guide.

字的陰影改50%
兩色塊目前分別是#02E8E8, #00CCCC
@mireille09 : 我美感不好，但感覺有比較漂亮 :)

from councilor-voter-guide.

@thewayiam +++
水喔

from councilor-voter-guide.

那個..選區跟參選人數也可以給陰影嗎?不透明30%就好. 或者字大一點這樣

from councilor-voter-guide.

如 #96 提到的問題
不知道如何讓數量資訊部分靠底部，又不影響目前整個方塊都可按的功能
程式碼所在處

from councilor-voter-guide.

我的建議-把選區跟參選人數兩行取消掉
因為點進去會看到選區
參選人跟應選人可以併到標題後面
看是要文字就好還是怎樣

大概就是這樣吧...
色塊上面的字型大小改成16看看

試著把 #02E8E8換成深一點(ex #1bd6d6)也許就不那麼刺眼了
不知道把背景做灰的(ex #d8dada、#e3e3e3)如何?

from councilor-voter-guide.

看一下程式碼，大概了解是怎回事了....

<div>&nbsp;</div>
<br>
<br> <!--這兩行相當於用Enter排版-->

選區和參選人數要保留--可以，我CSS做得到；要挪到子頁面，也可以，只是資料要拿得到

至於粗體字我覺得是排版問題，理論上可以不要卡到位的說

from councilor-voter-guide.

選區與參選人數保留調整（鄉鎮）

from councilor-voter-guide.

剛剛看到議案頁面，是不視野需要做類似的變更
議員投票指南 -- 找議案

from councilor-voter-guide.

是的，HTML位置如下
找議員HTML、找議案HTML、找表決HTML

from councilor-voter-guide.

顏色參考-提供紫色、藍色、橘黃三組
色碼已用http://www.huecode.com/ 試過，顯色ok，可做調整

from councilor-voter-guide.

其他頁面依序配色
找議員--藍色pair, 找議案--紫色pair, 找表決--橘色pair

from councilor-voter-guide.

那個..我不知道要在哪裡問.現在的頁面有修改了
但是有些縣市字體仍是白色的
可以改成黑色嗎?謝謝

from councilor-voter-guide.

縣市的字體會白色是因為連結的一系列效果都沒有更正，所以就只有一般狀態下是黑色

from councilor-voter-guide.

放了縣市政府logo很失焦.....

from councilor-voter-guide.

你是指首頁縣市logo嗎？
我是一直在想到底哪裡奇怪，如果可以請做解釋...

from councilor-voter-guide.

舉例而言報紙頭版會有一個頭條，跟其他新聞
他們會排出最重要的一個焦點，換言之頭條只會有一個
今天改這樣看似全部都是重點，但實際上卻變成沒有重點了
設計的細節在於每個設計只有一點點、小小的，等主題出來就可以襯托

我的建議是...
點進去的頁面顯示縣市府Logo不變
首頁的建議:
1.Logo拿掉
2.滑鼠移到上面才顯示Logo
3.Logo刷成黑灰白, 不至於看起來像大雜燴

設計到後來當東西越來越多的時候
less is more, 少即是多

from councilor-voter-guide.

然後我個人是有個建議...
這個網站在選舉結束之後可以持續更新...
往後像是某南部直轄市老是被砍預算這種事可以列頭條這樣...
只是會很麻煩!!!

from councilor-voter-guide.

縣市預算的部份我覺得要到其他專案發展了，因為這專案的核心就只是選舉查閱工具
不排斥裡頭的預算整理，但如果將這功能抽出來再做或許會更好
這就要看接下來有沒有人要開始新的專案了

from councilor-voter-guide.