Magicbox

Workinglist19Nov,2013MobileCREATIVEMOBILECREATIVETIMELINE8.1MagicBoxPackageDesignCompletedon14Novandapprovedon14Nov8.2MagicBoxLogoCreative8.2.1MagicBoxLogoIdeasandSketchTobecompletedon27Nov20138.2.2MagicBoxLogoDesignTobecompletedon29Nov20138.3SinaDesignofMBandMobile8.3.1掃描二維碼的微博授權(quán)頁面|AuthorizationpageTobecompletedon15Nov20138.3.2微博注冊(cè)頁面|WeiboRegisterPageTobecompletedon15Nov20138.3.3MagicBox主頁|MenuPageTobecompletedon15Nov20138.3.4個(gè)人信息頁面|ProfilePageTobecompletedon18Nov20138.3.5個(gè)人修改頁面|ProfileEditPageTobecompletedon18Nov20138.3.6使用說明頁面|InstructionsPageTobecompletedon27Nov20138.3.7商品列表頁面|ProductListPageTobecompletedon19Nov20138.3.8商品詳情頁面|ProductDetialsPageTobecompletedon25Nov20138.3.9領(lǐng)取贈(zèng)品頁面|ProductCollectionTobecompletedon20Nov20138.3.10支付成功頁面|SuccessPaymentTobecompletedon20Nov20138.3.11商家服務(wù)熱線頁面|ServicePageTobecompletedon21Nov20138.3.12更換頭像的彈窗頁面|HeadtoModifyPageTobecompletedon21Nov20138.3.13微博好友頁面|WeiboFriendListPageTobecompletedon22Nov20138.3.14微博分享頁面|WeiboSharingPageTobecompletedon22Nov20138.3.15簽到分享頁面|Check-InSharingPageTobecompletedon22Nov20138.3.16資料修改提示（popup）|ChangesProfileUpdatesTobecompletedon25Nov20138.3.17簽到失敗提示（popup）|Check-inFailurenotificationTobecompletedon25Nov20138.3.18購買無貨提示（popup）|GoodsSoldoutnotificationTobecompletedon25Nov20138.3.19微博分享成功的提示（popup）|SharingSuccessfulTobecompletedon25Nov20138.3.20取貨失敗提示（popup）|FailuretoReceiveGoodsTobecompletedon25Nov2013INTRODUCTIONTHISDOCUMENTSERVESTOCOVERALLTHENEEDEDGUIDELINEINTHECONSTRUCTIONOFTHEUI(USERINTERFACE)OFBOTHTHESCREENSONTHEMAGICBOXASWELLASTHEPERSONALSCREENS(MOBILE/PAD)OFCONSUMERS.ALLPARTIESSHOULDADHERETOTHISGUIDEBOOKFORREFERENCEONALLDESIGNDEVELOPMENTS.ColorpreferenceColorAisprimarycolors.Theoveralllook&feelshouldbedeliveredbythemashoftheprimarycolors.ColorBissecondarycolors.Secondarycolorsareappliedforclick,auxiliarycolor,secondarypages.ABCOLORMagicBoxColorPaletteisfresh，friendlyAndyoung.COLORMagicBoxColorPaletteisfresh，friendlyAndyoung.COLORMagicBoxColorPaletteisfresh，friendlyAndyoung.COLORCOLORMagicBoxColorPaletteisfresh，friendlyAndyoung.MBTiffanyGreenMBBlackMBPeachMBUltramarineMBVividBlueMBLightGreyRGB:46227168CMYK:600500HEX:#2ee3a8RGB:353233CMYK:70706575HEX:#232021RGB:255162172CMYK:050150HEX:#ffa2acRGB:77107156CMYK:8060150HEX:#4d6b9cRGB:6138168CMYK:8030250HEX:#068aa8RGB:237237237CMYK:5550HEX:#ededed90%80%70%60%50%90%80%70%60%50%90%80%70%60%50%90%80%70%60%50%90%80%70%60%50%70%50%

TYPOGRAPHYMagicBoxwanteveryonetobeabletoreadit,soweuseonlyoneChinesefont.Atthesametime，itisayoungman,oneEnglishfontcanhelpit.

CHINESEFONT微軟雅黑這佺是示例文本。ENGLISHFONTVerdenaABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789MOBILECREATIVEWORKINGSTATUSWELCOMEPAGERemarksepageallowsuserstofeeltheMBisfriendly.OVERALLSTYLISTICREFERENCEHOMEPAGEOVERALLSTYLISTICREFERENCEMAINMENURemarksHidebuttonandthedesignofsimpleinspiredme.OVERALLSTYLISTICREFERENCEMAINMENUPROFILEPAGEOVERALLSTYLISTICREFERENCESKINCUSTOMIZATIONRemarksTransparentandfuzzytextureisaccordwithourdesignconceptwiththemachine.OVERALLSTYLISTICREFERENCERemarksMakethebestofthecharacteristicsofmobilephone,theinformationhiddenintouchactions,achieveperfectinteraction.OVERALLSTYLISTICREFERENCEPRODUCTSPAGEPRODUCTSPAGEOVERALLSTYLISTICREFERENCEMOBILECREATIVEWORKINGSTATUSSketchMOBILECREATIVEWORKINGSTATUSICONWeiboFriendWeiboMessageFirstTimeUserMBLBSSecondTimeShareProfilePageEditPageMenuPageFlowIntroGetGiftProductListInputPinCodeShoppingAliPayPresentSelectWeibofriendConfirmSendDirectMessageShareProductUserFirstTimeJourneyUserSecondTimeJourneyWeiboFriendJourneyProduct*Loading&IdentifyConfirm*Loading&Identify*MagicBoxIdentify(onlyforoneuser)MAGICBOXUSINGSINAPLATFORMOption1.MULTISCREENFirstTime*LoadingOption2.MULTISCREENFirstTime*LoadingOption3.MULTISCREENFirstTime*LoadingREFERENCE.FLOWINTROFlowIntroMOBILECREATIVEWORKINGSTATUSAuthorizationPageRemarks121Sinalogin2WechartloginMOBILECREATIVEWORKINGSTATUSWeiboRegisterPageRemarksUpdateonNov21ApprovedonNov1Sinaregister1

INTERFACEHomepage

MOBILECREATIVEWORKINGSTATUSMenuRemarksUpdateonNov21ApprovedonNov1232Homepage

menubar

opensshowing

3

icons.3Other

pagesmenu

bar

opensshowing

5

icons.MOBILECREATIVEWORKINGSTATUSProfilePageRemarksUpdateonNov21ApprovedonNov121When

operating

menu,

background

will

blackout

and

mal-function2WechartframeINTERFACE

ProfilepageCharacterselectionissuperpower.-InvisiblemanINTERFACEProfilepage

ProfilepageCharacterselectionissuperpower.

-ReadyourmindINTERFACEProfilepage

ProfilepageCharacterselectionissuperpower.

-ChronoCrossINTERFACEProfilepage

ProfilepageCharacterselectionissuperpower.

-LeviationINTERFACEProfilepage

ProfilepageCharacterselectionissuperpower.

-PredictthefutureINTERFACEProfilepage

ProfilepageYourLabelMOBILECREATIVEWORKINGSTATUSProfilePageEditRemarksUpdateonNov21ApprovedonNov

Profile

image

will

be

pulled

from

SINA

or

Wechat

API.MOBILECREATIVEWORKINGSTATUSProductDetailsPageRemarksUpdateonNov21ApprovedonNov121Tap

on

product

and

details