Requirements Information and data which need to be displayed or accessible to the user Sitemapping (Site Map) Flow Chart models of site structure displaying.

Slides:



Advertisements
Similar presentations
Introduci ng :. .NET Presentation Overview: Summary of.NET Benefits Software Architecture.NET Screens Overview The purpose of this presentation is to.
Advertisements

UX Portfolio Derek Smith. Overview Slides to walk through the UX activities of a sample project Present key design elements of the sample project Some.
SERVICE AUTHORIZATION: This is what Care Schedules are called in CCMS. They will be reviewed later in more detail. TABS: Headings listed at the top of.
© 2011 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
Drupal Basics Part 3 Create a new page Main tabs menu Using the theme Agricultural Communications Services Integrated Media Training Sessions
Chapter 3 – Web Design Tables & Page Layout
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Drupal Basics Part 5 Understanding Blocks Using the theme Agricultural Communications Services Integrated Media Training Sessions
AIMSweb Progress Monitor Online User Training
Branding Initiation Eric Overfield SharePoint Advocate and Enthusiast PixelMill Your SharePoint 2013
GALVESTON COUNTY, TX P-CARD TRAINING GALVESTON COUNTY.
A Proposed Model for GV Express October 2008 RED version.
© 2010 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
Web Design Graphical User Interface Navigation. Website Prototyping Plan your website Take time to plan the goal And outcome for your site Based on target.
Intermediate Level Course. Text Format The text styles, bold, italics, underlining, superscript and subscript, can be easily added to selected text. Text.
WPML Translation plugin is the best option when you need to translate your Wordpress website into multiple languages. The plugin makes it easy to translate.
Interactive Prototype Presenter Sean Ren Group member Alicia Kellogg Chris Schlechty Danny Swisher.
Guide to Oracle10G1 Introduction To Forms Builder Chapter 5.
Introduction To Form Builder
Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
User Centered Web Site Engineering Part 2. Developing Site Structure & Content Content View Addressing content Outlining content Creating a content delivery.
Quick Start Guide. This 22 page introduction to the Financial Assessment Subsystem provides the user with a visual overview of the components of the system.
EBO Overview Part 1 Ingrid Bongers MT(ASCP) MBA eClinicalWorks Certified Trainer.
Getting Started with Adobe Dreamweaver CS6. Unit Objectives Define web design software Start Adobe Dreamweaver CS6 View the Dreamweaver workspace Work.
1 of 5 This document is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS DOCUMENT. © 2007 Microsoft Corporation.
Adobe Dreamweaver CS3 Revealed CHAPTER ONE: GETTING STARTED WITH DREAMWEAVER.
MAE Atlassian Tool Suite Administration Training July 8 th, 2013.
Pasewark & Pasewark 1 Outlook Lesson 1 Outlook Basics and Microsoft Office 2007: Introductory.
In the Sandbox Playing with SkillPort 7 for the first time.
PRIOS ARA Limited Agent User Instructions PRIOS ARA Limited Agent User Instructions Professional Repossessors Interactive Operating System.
Classroom User Training June 29, 2005 Presented by:
© Ms. Masihi.  The Dreamweaver Welcome Screen first opens when you start Dreamweaver.  This screen gives you quick access to previously opened files,
Rich Desktop Client Overview. Rich Desktop Client - Overview After you download and install SureClinical eTMF (through a link sent in the account activation.
Tutorial 1 Getting Started with Adobe Dreamweaver CS3
Creating a Web Site to Gather Data and Conduct Research.
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
Macromedia Dreamweaver 8 Revealed DREAMWEAVER GETTING STARTED WITH.
Chapter 7 IS630. Project Design  Technical Design & Specification Network and System Architecture & Design Software System Architecture & Design  Database.
INDIANAUNIVERSITYINDIANAUNIVERSITY OneStart page types  Tab – pages across the top, immutable  Section – pages down the left  Subsection – pages under.
1 What’s the difference between DocuShare 3.1 and 4.0?
1 of 8 This document is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS DOCUMENT. © 2007 Microsoft Corporation.
© 2010 Delmar, Cengage Learning Chapter 8 Collecting Data with Forms.
© 2008 Map of Medicine Ltd. Commercial and in confidence. Training Foundation Module 2 – Map Management Suite Ver. 19 Jan 2011.

Lecture 6 Title: Web Planning, Designing, Developing for E-Marketing By: Mr Hashem Alaidaros MKT 445.
USING WORDPRESS TO CREATE A WEBSITE (RATHER THAN A BLOG) STEP-BY-STEP INSTRUCTIONS.
Introduction to Enterprise Guide Jennifer Schmidt Rhonda Ellis Cassandra Hall.
FrontPage Tutorial Part 2 Creating a Course Web Site.
3 Copyright © 2004, Oracle. All rights reserved. Working in the Forms Developer Environment.
Classifications Schemes and Class Scheme Items in the Curation Tool: Interface Design Audrey Lipps, User-Centered Design
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
+ Website Training AwBA Lenneke Knoop MetaMeta Communications November 2015.
USING WORDPRESS TO CREATE A WEBSITE (RATHER THAN A BLOG) STEP-BY-STEP INSTRUCTIONS.
MIMOS Berhad. All Rights Reserved. Nazarudin Wijee Mohd Sidek Salleh Grid Computing Lab MIMOS Berhad P-GRADE Portal Heuristic Evaluation.
User Experience Services & Solutions
CSCI 6962: Server-side Design and Programming Facelets and User Interface Design.
Chapter 5 Introduction To Form Builder. Lesson A Objectives  Display Forms Builder forms in a Web browser  Use a data block form to view, insert, update,
Content Administration 08/19/13 & 08/20/13.
STAGES Language Application Overview. The Language Application is available on a separate URL (typically /stagesLanguage) and tied to only one database.
Techniques for List Creation (2) Data formatting and control level processing Basics for Interactive Lists Detail lists The Program Interface Interactive.
FHA Training Module 1 This document reflects current policy related to this topic. Its content is approved for use in all external and internal FHA-related.
2016 CSO System Training & Networking Conference / Copyright © 2016 #csoconf 2016 CSO System Training & Networking Conference / Copyright © 2016 #csoconf.
COMP 143 Web Development with Adobe Dreamweaver CC.
17 Copyright © 2006, Oracle. All rights reserved. Information Publisher.
My Stuff & More! How to personalize your OSLIS 2.0 “dashboard” and add files to your personal space.
About the To-Do Bar in Outlook
New Box Web Experience Inventory of changes.
Web Design and Development
Web AppBuilder for ArcGIS
Presentation transcript:

Requirements Information and data which need to be displayed or accessible to the user Sitemapping (Site Map) Flow Chart models of site structure displaying usable and accessible information/data/actions XHTML/CSS prototype model Testing code, images, and checking usability issues Site Structure Front-End Production Graphics/Visual “themes” Creating templates and visual models for graphics/images Style Guide Outline of XHTML/CSS details, plus specs/samples of images and other media Final Images Final images (…and other media files) Final Coding Final XHTML/CSS (…and other coding) Overview of the User Interface design and front-end development workflow. Back-End Integration Final database integration (and any programming required) Wireframing (Mockups) Layout and Navigation models showing interaction of page components across and within multiple views, including usability considerations (UX) “Information Architecture” (focus on content) “Interaction Design” (focus on tasks) (…existing website?) Visual Design User Interface Front-End Design/Development Workflow

Reports LeftNav Menu Dashboard Log Out (default opening screen) Login Gateways (list) Show Gateway Details Show Gateway Logs Show Gateway Routes Show Gateway Neighbors Edit Gateway Details Delete Gateway Connect Disconnect Collect Gateway Data Set Data Collection Schedule Delete Data Collection Show Network Tree Add to Group Gateways Gateway Groups Nodes Node Groups Report Schedules Gateway Groups (list) Show Gateway List Edit Gateway Group Delete Gateway Group Nodes (list) Node Groups (list) Show Node Details Show Node Logs Show Node Routes Show Node Neighbors Show Node Data Points Show Node Status Points Set Channel Configuration Get Channel Configuration Get Current Meter Reading Get Node Information Get Communication Status Add to Group Generate Report Show Node List Edit Node Group Delete Node Group Generate Report Report Schedules (list) View/Edit Schedule Delete Schedule Generate Report: PDF, HTML, CSV NM details Dashboard NM Info Search box Taskbar: # Items Selected, Messages, Notifications Report Dialog box Show Report Tree Billing Read Data Completeness Interval Data Summary Node Outage Node Status System Health Node Group Data Completeness Node Data Completeness Meter Errors Node Resets Time Syncs User Interface Flow Chart Sample Interface top-level flow chart to an online application (“site mapping”)

Primary Content fixed width (retractable) “fluid” Generic User Interface mockup (“wire framing”) Primary Navigation (“Left Nav” plus pull-out Menus) Tab Supplemental Navigation (“Top Nav” Tabs) User Name | Logout Secondary Navigation ( adjustable/editable Column Headers) logo Search Bar