UxP & CSS
Programmers produce the application layer code that drives the logic of the system.
UxP coders produce the presentation layer design that displays the system.
Therefore:
UxP "owns" the Presentation Layer
This includes HTML, CSS, graphics and appropriate client-side Javascript code (that defines behaviors).
The Challenge
At Inception:
- UxP designs HTML pages.
- Programmers take HTML pages from UxP, chop them up and embed the pieces – along with logic code - into the code platform.
When the UI changes:
- UxP re-designs HTML pages.
- Programmers take the altered HTML pages from UxP, chop them up and embed the pieces – along with logic code - into the code platform.
Advantages
- The Logic and Presentation are both embedded in the program code platform.
Issues
- Even a simple change to the UI requires a total re-programming of the underlying Logic code.
- The Programmer becomes the implementation gatekeeper - which can be a Team Workflow Bottleneck.
For example: Re-ordering the layout of fields in a page or re-naming of a label require re-coding by a programmer, even though there is no change in terms of function or logic.
The Solution
Interaction Designer
Creates HTML page containing:
- HTML, which defines layout and text labels
- Cascading Style Sheets (CSS) and classes (CSS tags)
- Graphics
Programmer
- Creates client-side code (s.a. validation).
- Creates server-side code
- Embeds appropriate code invocation in HTML page
Information Architect
- Defines MetaData tags which identify dynamic data “hooks”
Technical Architect
- Determines whether code is client or server-side
- Defines code invocation techniques and tags
Advantages
- The Logic is owned by Programmers - They don’t have to deal with HTML
- The Presentation is owned by UxP - A change to the UI probably doesn’t involve Programmers
- There is no functional overlap of responsibility
Issues
- Metadata tags must be defined and managed
- Code Invocation tags must be defined and managed