From Students…

…to Professionals

The Capstone Experience

Alpha Presentation HTML5-Based WYSIWYG Label Designer

Team Plex Systems Andrew Melfi

Michele Winsky Matthew Duffy

Department of Computer Science and Engineering Michigan State University

Spring 2012

Project Overview

• HTML5-based WYSIWYG Label Designer

Label designer created with web technologies

oApplication supports major modern browsers

oBrowser support depends on HTML5 implementation

Support end user creation of new label layouts

Created label flows are used in tracking manufacturing processes

SQL Server receives designs and provides them to the user

The Capstone Experience Team Plex Systems Alpha Presentation 2

System Architecture

The Capstone Experience Team Plex Systems Alpha Presentation 3

Default Application View

The Capstone Experience Team Plex Systems Alpha Presentation 4

Placed Object

The Capstone Experience Team Plex Systems Alpha Presentation 5

Barcode Edit

The Capstone Experience Team Plex Systems Alpha Presentation 6

Image Edit

The Capstone Experience Team Plex Systems Alpha Presentation 7

Line Edit

The Capstone Experience Team Plex Systems Alpha Presentation 8

Text Label Edit

The Capstone Experience Team Plex Systems Alpha Presentation 9

Text Data Edit

The Capstone Experience Team Plex Systems Alpha Presentation 10

Final Label Layout

The Capstone Experience Team Plex Systems Alpha Presentation 11

Live Demo

What’s left to do?

• Menu Screens Save/Load/Management

Label properties

• Text Labels/Data Dynamic font sizes

Font types

• Element Orientation

• Saving/Loading from the database

• Usability improvements

The Capstone Experience Team Plex Systems Alpha Presentation 12