USER INTERFACE DESIGN SPECIFICATIONmydlink version1Version 1.027th, March, 2009UI Contacts:Even Syao (even_syao@dlink.com....
UI Design Spec: mydlink | version1Table of Contents:1     INTRODUCTION.......................................................
UI Design Spec: mydlink | version11 IntroductionThis document defines the specification of all Phase I mydlink web pages i...
UI Design Spec: mydlink | version12 Sign Up mydlink2.1 User flow of signing up mydlink (refe. DCS-1130/1100 Wizard SPEC)  ...
UI Design Spec: mydlink | version12.2 Rules of sign-up-     Register mydlink only via Installation Wizard.2.3 Verification...
UI Design Spec: mydlink | version12.4 User flow of clicking verification URL for signup mydlink:  Verification URL        ...
UI Design Spec: mydlink | version1        (a) Signup complete page: (signinsignup-complete-wizard.html)                   ...
UI Design Spec: mydlink | version1ID      Item                                Description/ActionA       Header right-top g...
UI Design Spec: mydlink | version1            (b) Message page for already clicked URL: (profileemail-url-clicked.html)ID ...
UI Design Spec: mydlink | version13 Sign in mydlink3.1 Page flow for unverified users (2009/8/26)                         ...
UI Design Spec: mydlink | version13.2 My Profile page (profileindex.html)                                                 ...
UI Design Spec: mydlink | version1 ID      Item                           Description/Action D       text                 ...
UI Design Spec: mydlink | version13.3 Reminding Page (profileunverified_email.html)  ID      Item                         ...
UI Design Spec: mydlink | version1  A       Top-right menu                 -   Highlighted on “My Profile”  B       Title ...
UI Design Spec: mydlink | version1  -    No.: show the message of no device under the account (6.1)  -    Yes: to (2)(2) S...
Upcoming SlideShare
Loading in …5
×

md UI spec demo

756 views

Published on

Published in: Art & Photos, Technology, Design
  • Be the first to comment

  • Be the first to like this

md UI spec demo

  1. 1. USER INTERFACE DESIGN SPECIFICATIONmydlink version1Version 1.027th, March, 2009UI Contacts:Even Syao (even_syao@dlink.com.tw)
  2. 2. UI Design Spec: mydlink | version1Table of Contents:1 INTRODUCTION............................................................................................................................................................................................................................................................................. 32 SIGN UP MYDLINK........................................................................................................................................................................................................................................................................ 4 2.1 USER FLOW OF SIGNING UP MYDLINK (REFE. DCS-1130/1100 WIZARD SPEC) ........................................................................................................................................................................... 4 2.2 RULES OF SIGN-UP ....................................................................................................................................................................................................................................................................... 5 2.3 VERIFICATION EMAIL SPEC: ....................................................................................................................................................................................................................................................... 5 2.4 USER FLOW OF CLICKING VERIFICATION URL FOR SIGNUP MYDLINK: ......................................................................................................................................................................................... 6 (a) Signup complete page: (signinsignup-complete-wizard.html) ..................................................................................................................................................................................... 7 (b) Message page for already clicked URL: (profileemail-url-clicked.html) ..................................................................................................................................................................... 93 SIGN IN MYDLINK....................................................................................................................................................................................................................................................................... 10 3.1 PAGE FLOW FOR UNVERIFIED USERS (2009/8/26)....................................................................................................................................................................................................................... 10 3.2 MY PROFILE PAGE (PROFILEINDEX.HTML) ............................................................................................................................................................................................................................... 11 3.3 REMINDING PAGE (PROFILEUNVERIFIED_EMAIL.HTML)........................................................................................................................................................................................................... 13 3.4 RULES OF DEFAULT PAGE AFTER LOGIN ..................................................................................................................................................................................................................................... 14 2 Confidential and Proprietary, D-Link Corporation Inc.
  3. 3. UI Design Spec: mydlink | version11 IntroductionThis document defines the specification of all Phase I mydlink web pages in March launch, which covers below:- Member mechanism of mydlink: sign up, sign in, profile management, delete devices- DCS-1100/1130 function on mydlink: Live video, camera settings, camera informationTerminology about mydlink: 1. UCP (User-Centric Portal): Multi-devices can be added into a mydlink account. After signing in mydlink, the user can manage the individual devices under his account. 2. mydlink No.: Each mydlink device has a unique 8-digit mydlink No. which is used to add the device to a mydlink.com account. 3 Confidential and Proprietary, D-Link Corporation Inc.
  4. 4. UI Design Spec: mydlink | version12 Sign Up mydlink2.1 User flow of signing up mydlink (refe. DCS-1130/1100 Wizard SPEC) 4 Confidential and Proprietary, D-Link Corporation Inc.
  5. 5. UI Design Spec: mydlink | version12.2 Rules of sign-up- Register mydlink only via Installation Wizard.2.3 Verification email SPEC:# Items Details1.1 Sender Name mydlink1.2 Sender email notification@mydlink.com1.3 Subject Activate your mydlink account1.4 Email to The user’s signup email 11.5 Contents Hello xxxname , Thank you for joining mydlink. To activate your mydlink account, please click the link below: xxxxxxxxxxxx If clicking the link doesnt work, copy and paste the URL address into Internet Explorer. After activating your account, you will be able to sign in to www.mydlink.com using the e-mail address and password you provided during the signup or Installation wizard process. If you have received this e-mail in error, please ignore this e-mail and we apologize for the inconvenience. mydlink.com ==================================== This e-mail message was sent from a notification-only address that cannot accept incoming e-mail. Please do not reply to this message. If you have any questions, please contact mydlink customer service at www.mydlink.com/contact/ ==============================1.6 Email Format text 1 Display this user’s name. 5 Confidential and Proprietary, D-Link Corporation Inc.
  6. 6. UI Design Spec: mydlink | version12.4 User flow of clicking verification URL for signup mydlink: Verification URL Already (a) Sign up no on the email clicked? complete page yes (b) Already clicked Mydlink home Sign In msg page page 6 Confidential and Proprietary, D-Link Corporation Inc.
  7. 7. UI Design Spec: mydlink | version1 (a) Signup complete page: (signinsignup-complete-wizard.html) 7 Confidential and Proprietary, D-Link Corporation Inc.
  8. 8. UI Design Spec: mydlink | version1ID Item Description/ActionA Header right-top greeting message Welcome, [user name] - Show the “user name” setting of signup mydlink on the Wizard.B Bar title mydlink Signup CompleteC texts Congratulations! Your account is now active and your device was successfully activated.D Show mydlink signin account Show this user’s mydlink signin e-mail accountE Image+text Information for installing ActiveXF Button - Label Name: Start mydlink - Click it to the default page after login (3.1) (3.4) (3.5) 8 Confidential and Proprietary, D-Link Corporation Inc.
  9. 9. UI Design Spec: mydlink | version1 (b) Message page for already clicked URL: (profileemail-url-clicked.html)ID Item Description/ActionA Title Bar E-mail VerificationB texts The verification link has already been used, and the e-mail account has already been verified. Please click on the button below to return to the mydlink home page to sign in.C Button Label Name: Sign In Click to the home page of mydlink 9 Confidential and Proprietary, D-Link Corporation Inc.
  10. 10. UI Design Spec: mydlink | version13 Sign in mydlink3.1 Page flow for unverified users (2009/8/26) 10 Confidential and Proprietary, D-Link Corporation Inc.
  11. 11. UI Design Spec: mydlink | version13.2 My Profile page (profileindex.html) 11 Confidential and Proprietary, D-Link Corporation Inc.
  12. 12. UI Design Spec: mydlink | version1 ID Item Description/Action D text - Clickable text: (Unverified) - Only shown when this user’s signin email account hasn’t verified. - Click it to “profileunverified_email.html” 12 Confidential and Proprietary, D-Link Corporation Inc.
  13. 13. UI Design Spec: mydlink | version13.3 Reminding Page (profileunverified_email.html) ID Item Description/Action 13 Confidential and Proprietary, D-Link Corporation Inc.
  14. 14. UI Design Spec: mydlink | version1 A Top-right menu - Highlighted on “My Profile” B Title bar: text - E-mail Verification Needed! C Explanation texts You have not verified your mydlink sign-in e-mail address yet. Click Resend e-mail to resend your verification e-mail. Click Change e-mail to change your sign in e-mail. D Button - Label Name: Resend e-mail - Click it to send a verification email again and show below message: A verification e-mail has been sent to xxxx@xxx.xx - xxxx@xxx.xx : show this user’s signin email account E Button - Label Name: Change e-mail - Click it to “Change sign-in E-mail” page (profileemail-edit.html) and follow original change email SPEC F Button - Label Name: Back to My Profile - Click it to My Profile home page (profileindex.html)3.4 Rules of default page after loginCheck the below according to the sequence: (1) Any devices under account? 14 Confidential and Proprietary, D-Link Corporation Inc.
  15. 15. UI Design Spec: mydlink | version1 - No.: show the message of no device under the account (6.1) - Yes: to (2)(2) Sign-in e-mail verify or not? - Verified: to My Device default page: to (3) - Not verified: to the remaindering page (3.4-a)(3) Online devices or not? - Yes: to the 1st online device’s home (function default) page on the device list. It will be to “Live Video” page for current DCS-1100/1130 models. The display sequence of devices on the device list is based on the descending mydlink No. - No: to the 1st offline device page on the device list. 15 Confidential and Proprietary, D-Link Corporation Inc.

×