Chase.com Content Management Presentation

  • 669 views
Uploaded on

In 1999, this presentation was given to the Chase Manhattan internet project team which was made up of over 30 VPs.

In 1999, this presentation was given to the Chase Manhattan internet project team which was made up of over 30 VPs.

More in: Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • Find coupons for your hosting. Get a promo deal before you purchase hosting http://www.scriptcoupons.com/Vps.net/
    Are you sure you want to
    Your message goes here
    Be the first to like this
No Downloads

Views

Total Views
669
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
0
Comments
1
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Template Review Meeting Presentation & Discussion presented to Chase Manhattan Bank Site Strategy & Direction Team & The Content Migration Team March 29, 1999
  • 2. Agenda
    • Introduction
      • Provide History and Context
    • Templates and Design
      • Content Management System
      • Template Objectives
      • Content Types
    • Break
    • Template Functionality
      • Gather Input and Recap
    • 9:00 - 9:15 am
    • 9:15 - 10:15 am
    • 10:15 - 10:30 am
    • 10:30 - 12:00 pm
  • 3. How do Templates fit in the Bigger Picture? Content reconfigured into “new chase.com” design and information architecture Existing Content Moving to New Chase.Com New Content Created for New Chase.Com Finalized “New Chase.Com” Designs Content Management System Search Metatags Functional Templates Coded
  • 4. Templates
    • Separate the content from the presentation of the content
    • Include predefined areas for text and graphics
  • 5. Why Move to a Template-based Site?
    • Increase speed of publishing new content
        • Eliminate the need to create custom code for each new piece of content
        • Enable non-technical resources to update content
    • Encourages consistency in:
        • Look and feel: users experience consistent Chase identity
        • Navigation: users have a stable structure and are less likely to get lost or be confused
    • Enable Chase to quickly make global changes
        • Save money and time for updates
    • Common Process throughout the Enterprise
        • Save money and time on training and support
  • 6. About Content Management Systems
    • Supports workflow to publish new content in a timely manner
    • Allows for version control and archiving of web-related files
    • Minimizes the possibility of overwriting files when multiple people are working on the same file
    • Dynamically publish web pages
      • Assures users see the freshest content
      • Provides a platform for future Personalization
  • 7. About FutureTense:
    • Developed the FutureTense Internet Publishing System (IPS)
      • Provides services for high-quality, high-volume environment:
        • for Web production staff
        • for delivery of content to end-users
      • Enables Chase to:
        • streamline production
        • index information to make it searchable
        • feed information into standard templates
        • support workflow processes
        • track revisions to web-related files
  • 8. iXL & FutureTense
    • iXL:
      • Has translated designs for pages into templates.
      • Has worked closely with FutureTense to insure templates work within the IPS.
      • Will deliver templates and specifications to Chase and FutureTense. (Planned 4/1)
    • FutureTense and Chase:
      • Will integrate the templates into IPS.
      • Prepare the templates and system for the migration of content. (Planned 4/15)
  • 9. Template Specifications based on Design Guidelines
    • Design Guidelines : (flexible)
      • are recommendations to follow when designing a page to insure maximum usability and consistency
      • include “soft” guidelines such as:
        • whenever possible, use lists instead of dropdowns
        • place emphasis of usable information, rather than sales
        • minimize usage of paragraphs on “directory pages”
    • Specifications: (less flexible)
      • are the detailed, technical instructions needed to create a page of the design
      • include “hard” data such as:
        • image size has a maximum width of 350 pixels
        • header typeface is Verdana, 18 point bold
  • 10. Template Design Process
    • 1. Consider previous input and learning
    • 2. Break Pages into Components
    • 3. Identify Variability
      • Flexibility
      • Standards
  • 11. Template Design: Page Analysis, Step 2
    • Breaking down each page into it’s component parts, including the following:
        • Navigation
        • Header
        • Body
          • Text
          • Bulleted Lists
          • Images
          • Links
          • Linksets
          • Sub-Headers
        • Footer
  • 12. Template Design: Page Analysis, Step 3
    • Identifying the trade-off between Standards & Flexibility
      • Areas for Standards
        • Presence of Chase logo and other branding elements
        • Location and functionality of Navigation (breadcrumbs)
      • Recommended Areas for Standards
        • Font size for header, body, and footer sections
        • Aspect ratio of photographs
      • Areas for Flexibility
        • Number of images
        • Length of pages/Layout in content area
  • 13. Break 15 Minutes
  • 14. Today
  • 15. 6.15
  • 16. After 6.15
  • 17. Today
  • 18. 6.15
  • 19. After 6.15
  • 20. Today
  • 21. 6.15
  • 22. Templates & Sub-Templates
    • Templates can be made up of Sub-Templates
    • Templates and Sub-Templates:
      • Define Visual Geometry
      • Provide code to talk to the “Back-end”
    • Usage of Sub-Template provides flexibility
  • 23. Global Templates: Overview Left Navigation Top Navigation Content Area Specialty Navigation Below Left Navigation
  • 24. Global Templates: Top Navigation (TN)
  • 25. Global Templates: Left Navigation (LN)
  • 26. Global Templates: Specialty Navigation (SN)
    • Reserved for Middle Market, Private Bank, CMS, etc.
    • Should not be used to feature functionality, products, special offers, etc.
  • 27. Global Templates: Below Left Navigation (BLN) - Option 1
    • Option 1 is a linkset:
      • has fixed width
      • has varying height
  • 28. Global Templates: Below Left Navigation (BLN) - Option 2
    • Option 2 is 1-3 graphics:
      • have fixed width
      • have varying height
  • 29. Sub-Template G1: Overview Header Body Footer
  • 30. Sub-Template G1: Header Options or or or or
  • 31. Sub-Template G1: Header Option 1
    • Option 1 is a one column, one row solution.
    • This option can contain either text or a graphic.
    Chase Credit Cards or or
  • 32. Sub-Template G1: Header Option 2 CDs & Rates Chase Liability Products CDs & Rates or or
  • 33. Sub-Template G1: Header Option 3 Valued Card Members The Service you deserve from your Chase Gold Bell Atlantic Credit Card or or
  • 34. Sub-Template G1: Header Option 4
    • Can contain HTML
    • End user sees normal display
    • Must know HTML to use
    • Maximum Flexibility
  • 35. Sub-Template G1: Header Option 5
    • Used for pages with log-in box only
  • 36. Sub-Template G1: Body Options or or
  • 37. Sub-Template G1: Body Option 1
    • 1. Choose Content , Content Component, Content Order
    • 2. The system links your choices to form an Article
    • 3. The Article is presented in the Template
  • 38. Sub-Template G1: Body Option 1
    • 1. Choose Content , Order, and Type
      • Text, Bulleted Lists, Images, Links, Linksets, Sub-Headers
      • Choose any mix of 5 to create an Article
    • A Group of Articles is a Collection
    Article A - Graphic, Text, Text, Linkset, Bulleted List % Order - 1, 2, 3, 4, 5 Article B - Graphic, Graphic, Graphic, Graphic, Graphic Article C - Sub-Header, Text, Bulleted List, (BLANK) , (BLANK) Article D - Graphic, (BLANK), Text, (BLANK), Linkset } Collection
  • 39. Sub-Template G1: Body Option 1: 3 Column Article Example
    • 1. Choose Content
      • Pick 5 Content Types and Content
      • Pick Order of the Content Types
    • 2. The system creates an Article
    • 3. Article is published into the Body Template
    Graphic, (BLANK), Text, (BLANK), Linkset Article D
  • 40. Sub-Template G1: Body Option 2
    • Build a collection of articles to present in a body template
    • Any Questions?
    Article A - Graphic, Text, Text, Linkset, Bulleted List Article B - Graphic, Graphic, Graphic, Graphic, Graphic Article C - Sub-Header, Text, Bulleted List, (BLANK) , (BLANK) Article D - Graphic, (BLANK), Text, (BLANK), Linkset
  • 41. Body Example
    • Homepage
      • Personal
        • Credit Card
          • Bell Atlantic Gold Card
  • 42. Body Example
  • 43. Graphic Text Graphic Link Empty Empty
  • 44. Graphic Text Graphic Empty Empty Empty
  • 45. Sub-Template G1: Body Option 3
    • Can contain HTML
    • End user sees normal display
    • Must know HTML to use
    • Maximum Flexibility
  • 46. Sub-Template G1: Footer
  • 47. Sub-Template G1: Footer Page Specific Content Area (LOB) Specific Content
  • 48. Post 6.15
    • 6.15 is a direct migration
    • Post 6.15 you take advantage of more features of the template
  • 49. Sub-Template G2
    • H
      • Same with less width
      • No
    • B
      • Same with less width
      • only two columns in an article (“2 in a row”)
    • F
      • Same with less width
  • 50. Sub-Template G2: Header Options or or or
  • 51. Sub-Template G2: Body Options or or or
  • 52. Sub-Template G2: Footer
  • 53. Sub-Template G2: Right Side Bar
  • 54. Sub-Template G2: Right Side Bar
  • 55. Sub-Template G2: Right Side Bar Background Graphic with linkset HTML Bucket Graphic Header
      • Link
      • Link
      • Link
      • Link
    Text Header
      • Link
      • Link
      • Link
      • Link
  • 56. Questions
  • 57. Next Steps
    • Receive Feedback
    • Finalize Specifications
    • Deliver Template Specification and Code to Chase and FutureTense