交互章魚鬧鐘主題設(shè)計(jì)

設(shè)計(jì)iOS移動(dòng)端適配規(guī) 必須按尺寸規(guī)范輸出，@2x和@3x目 2. 3x規(guī)范： 6Plus為例，尺寸1242px＊2208px詳細(xì)解 章魚鬧鐘Card （鬧鐘card有自己的規(guī)范，詳情見《章魚鬧鐘card規(guī)范》頁面A（無鬧鐘card）

頁面A（無鬧鐘

點(diǎn)擊右上角按鈕進(jìn)入此鬧鐘編輯頁面A（有鬧鐘

隨機(jī)選中默認(rèn)／用戶設(shè)置好的鬧鐘card頁面 頁面 iOS移動(dòng)端適配規(guī) （640x1136） 6Plus（1242x2208 6Plus之間的關(guān)系是1.5@2x @3x3x規(guī)范1242px＊2208px6Plus 尺寸設(shè)計(jì)必須要在696px＊696px1242px

2208px2208px頁面A（無鬧鐘card） 頁面A鬧鐘card滑動(dòng)效 頁面A69 210px69 210px69567px75px567px75pxb1242px

1242px

168px

72px尺寸：設(shè)計(jì)師自定義背景567px162px210px尺寸：設(shè)計(jì)師自定義背景567px162px210px設(shè)計(jì)師可設(shè)計(jì)的透明區(qū)域尺寸：1242px＊162px，形式不限

90px90px設(shè)計(jì)師設(shè)計(jì)時(shí)間小時(shí)文字的大小在168px＊210px內(nèi)，分鐘尺寸大小在72px＊90px時(shí)間表達(dá)樣式不限，需要0-9數(shù)字全部設(shè)計(jì)出來

502px75px75px

圖示

圖示設(shè)計(jì)師可設(shè)計(jì)日期的背景圖樣式，尺寸大小高度在75px內(nèi)，

138px圖示

圖示

138px138px

圖示1242px

此背景 （card后的背景）設(shè)計(jì)師可自行設(shè)計(jì)尺寸：1242px＊2208px，背景也可以是純色

設(shè)計(jì)師可設(shè)計(jì)添加功能按鈕，大小需在138px＊138px內(nèi)，章魚鬧鐘頁面A（首頁 尺寸：1242px＊567px，背景 圖示b部分設(shè)計(jì)師可設(shè)計(jì)的透明區(qū)域尺寸：1242px＊162px，形式不限圖示c部分設(shè)計(jì)師可設(shè)計(jì)日期的背景圖樣式，尺寸大小高度在75px內(nèi)，長(zhǎng)度可隨日期的變換自動(dòng)拉伸，圖示d168px＊210px內(nèi)，分鐘尺寸大小在72px＊90px時(shí)間表達(dá)樣式不限，但是每個(gè)都需要0-9數(shù)字全部設(shè)計(jì)出來圖示e部分設(shè)計(jì)師可設(shè)計(jì)添加功能按鈕，大小需在138px138px內(nèi)，表達(dá)樣式不限，但需要其他界面上與其同級(jí)的按鈕card后的背景 設(shè)計(jì)師也可以自行設(shè)計(jì)，背景尺寸為：（w)1242px＊(h)2208px，背景也可以是純色， 頁面

138px

270px

270px138px156px156px138px156px156px 圖示設(shè)計(jì)師可設(shè)計(jì)“返回”“關(guān)閉”功能按鈕，大小需在138px＊138px內(nèi)，

圖示270px

270px2208px2208px

156px 156px156px156px270px156px156px

1170px156px1170px156px

156px156px156px270px156px

1242px 尺寸：1242px＊2208px

圖示此按鈕區(qū)域顯示的文字不需要設(shè)計(jì)，設(shè)計(jì)師只需設(shè)計(jì)按鈕的樣式和兩種狀態(tài)，及常態(tài)和選中后的 此按鈕可橫向拉伸，拉伸最大尺寸為1170px＊156px，按鈕樣式可自由設(shè)計(jì)

章魚鬧鐘頁面圖示a部分設(shè)計(jì)師可設(shè)計(jì)“返回”“關(guān)閉”功能按鈕，大小需在138px138px內(nèi)，表達(dá)樣式不限，圖示b部分的按鈕區(qū)域顯示的文字不需要設(shè)計(jì)，設(shè)計(jì)師只需設(shè)計(jì)按鈕的樣式和兩種狀態(tài)，及常態(tài)和選中后的 此按鈕可橫向拉伸，拉伸最大尺寸為1170px＊156px，按鈕樣式可自由設(shè)計(jì)，圖示b中的文字與數(shù)字設(shè)計(jì)師不可設(shè)圖示c部分按鈕的設(shè)計(jì)規(guī)范同圖示b按鈕的要求，兩種狀態(tài)，常態(tài)和 狀態(tài)，可以橫向拉伸，原始尺寸270px*156px，最大拉伸尺寸1168px＊156px，形式不限，設(shè)計(jì)師可自由設(shè)計(jì)，圖示c中的文字設(shè)計(jì)師不可設(shè)計(jì) ，也可以是純色，但需要設(shè)計(jì)師給出色值號(hào)，尺寸：1242px＊2208px頁面C效果圖頁面 頁面C效頁面C標(biāo)注圖a

頁面 b138px138px 138px圖示設(shè)計(jì)師可設(shè)計(jì)“返回”功能按鈕，大小需在138px＊138px內(nèi)，2208px2208px 尺寸：1242px＊2208px圖示1242px章魚鬧鐘頁面圖示a部分設(shè)計(jì)師可設(shè)計(jì)“返回”功能按鈕，大小需在138px138px內(nèi)，表達(dá)樣式不限，但需要界面A,界面B上與其同級(jí)的按鈕“添加”“關(guān)閉”與之統(tǒng)一圖示b部分此背景 尺寸：1242px＊2208px 備注：所有命名都需英文，不可出現(xiàn)中文，格式 1242px＊2208px6Plus鬧鐘Card效果圖頁面A中Card樣 頁面B中Card樣 頁面C中Card樣 頁面B中Card樣鬧鐘Card鬧鐘Card1開啟狀態(tài)鬧鐘Card1關(guān)閉狀態(tài)

鬧鐘Card2鬧鐘Card2鬧鐘示例Card1

鬧鐘Card

需設(shè)計(jì)0-9十個(gè)數(shù)字，

1242鬧鐘Card整體形式設(shè)計(jì)師可1242

和狀態(tài)，設(shè)計(jì)師可在給出尺寸范圍內(nèi)設(shè)計(jì)按鈕的樣式鬧鐘Card3個(gè)功能按鈕的樣式設(shè)計(jì)師可自行設(shè)置其樣式 207

鬧鐘Card按鈕上的“設(shè)置”“刪除”“關(guān)閉”文字，鬧鐘Card設(shè)計(jì)師可設(shè)計(jì)區(qū)域范 card角色頭像切圖大小是246px＊246px圓形內(nèi)，246px

246pxcard角色人物頭像是根據(jù)card的主角來做的，246pxcard的名稱鬧鐘Card一個(gè)鬧鐘card的切圖，需要放在一個(gè)文件夾中，命名必須為英文，如 名為card－位置－狀態(tài)－test@3x.png鬧鐘Card1切圖與命名示例

1242 1242

鬧鐘Card一個(gè)鬧鐘card的切圖，需要放在一個(gè)文件夾中，命名必須為英文，如 名為card－位置－狀態(tài)－test@3x.png

鬧鐘Card1切圖與命名示例