GateIn UXP - Acme Sites (Draft 2)

1,318 views

Published on

An Informal Site Layout and Configuration Analysis, with a Workflow Suggestion for Site Development (Draft 2)

This second draft of the presentation includes some details and very brief discussion about pages in the Acme Social Intranet, as well as a page describing some possible directions for extending on the Acme model.

Published in: Technology, Design
1 Comment
0 Likes
Statistics
Notes
  • Reviewing these slides makes me think of another system I dealt with that has really covered the market when it comes to the UXP, Centralpoint by Oxcyon. Let's be honest when you're looking for a CMS with the UXP you want to get the most bang for your buck. VS Centralpoint's 250 modules out of the box and that it is the best when it comes to portal systems it makes you wonder why are we looking at this.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

No Downloads
Views
Total views
1,318
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
5
Comments
1
Likes
0
Embeds 0
No embeds

No notes for slide

GateIn UXP - Acme Sites (Draft 2)

  1. 1. GateIn UXP – Acme SitesAn Informal Site Layout and Configuration AnalysisWith a Workflow Suggestion for Site Development Sean Champ spchamp % users.sourceforge.net Draft 2 - July 2012
  2. 2. GateIn UXP• GateIn Portal Framework + Social Intranet Components• Commercially supported in eXo Platform• GateIn UXP edition includes two sample portals  ACME Web Site  ACME Social Intranet
  3. 3. Acme Web Site (GateIn Demo)
  4. 4. Acme Web Site Portlets and Editable Regions Toolbar PortletsContent Detail Content ListPortlets Portlets
  5. 5. Acme Web Site Thematic Overview• Public Content - Presentational Focus  Clean Appearance in Content  Consistent Decorative Style in Layout Elements  Background Images  Icons and Icon Styles  Site Color Theme  Coordination of Design Style Among Elements
  6. 6. Acme Web Site Structural Overview• Design elements are contained within static blocks defined by portlet structures  HTML  Images• Page design is constructed with simple portlets – Content Portlets, in this example  Content Detail  Content List• Content Portlets - Content Elements  HTML  CSS  CSS classes, referencing ….  CSS stylesheets for page (howto?)  Images  Groovy Scripting ??? Templates ???• Editing Workflow  Content can be edited with GateIn Content Explorer, in the browser window  Content can be pushed to server via GateIn WebDAV adapter, in the development network (howto?)
  7. 7. A Development Workflow Page One - Overview• Summary: Two site editions – static HTML locally designed, partitioned, then reconstructed in the portal• Concept  Develop the site locally with conventional toolchains  Partition the content automatically for publication to the portal;  Publish the content to the portal (WebDAV)  Reconstruct the original site design using specified portlets (may be automated)• Benefits – Allows for ease and familiarity of workflow with conventional toolchains and site development models – Allows adaptation of published content, using the flexible portal framework – “Best of both worlds”• Requirements – Familiarity with conventional toolchains – Familiarity with portal structure, layout, and portlet availability – Familarity with techniques and tools for site partitioning and publishing• Toolchains  Web editor toolchain may include Adobe Dreamweaver or other web site editing platform  Graphics Editing Toolchains  Vector Graphics Toolchain  Raster Graphics Toolchain  Audio/Video Editing Toolchains
  8. 8. A Development Workflow Page Two – The Process Local Site Edition (Static XHTML)  Design and develop the pages and other content items using the selected toolchains  Partition the pages structurally, for reconstruction in portlets  Content Display Portlet, for Singleton Content  Content List Portlet, for Enumerated Content  Denote each partitioned element for its target portlet  Using a specially selected CSS class on each block level element, denote each target portlet by type - content display, content list, etc <div class=“foo contentDisplay”>…</div>  Use the HTML ‘id’ value on each partitioned block level element, to denote the file name of the generated content element file <div class=“foo contentDisplay” id=“fooBanner”>…</div>  Generate partitioned site with individual named content elements, using XSL  Page Content Elements – Extract the partitioned content blocks into individual files, each named per HTML ID  Page Meta-Elements – Extract the CSS, script components, page meta tags, and other page metadata into individual files, each named for the type of the containing element and the content  Include any additional media components – graphics, audio, video – in the final portal publication set  Publish partitioned content elements to portal, via WebDAV Portal Site Edition  Construct the portal pages, retaining the site structure (folders) as developed in the static HTML edition  May be automated on the portal side, with the addition of some third party code
  9. 9. More About GateIn Portlets Configuring the Content Display Portlet• Content Path• Displayable Options  Title  Date  Option Bar – Displays the ‘print’ link• Print Settings  “Show in page” (?)  “With” (?)• Advanced Settings  Dynamic Navigation - content change with URL params  Content Visibility Restriction – by ‘authentication’ or ‘role’
  10. 10. More About GateIn Portlets Configuring The Content List Portlet• Content Selection – Display Mode • “By Folder” – Display all content in folder • “By Content” – Manual selection of displayed content – Folder Path – Sorting Order for List Items• Display Settings – Header Text – Template Selection (THIS IS IMPORTANT!) – Pagination (UNIQUE!) – Number of Displayed Items per Portlet ‘Page’ – Displayable items - Toggle • Title • Image • Summary • Header • Date • Link • Referesh • “More” • RSS Feed
  11. 11. More about GateIn Portlets (from the GateIn User Guide 3.5)• Every page element is contained by a portlet• Functional Portlets  Account Portlet – account registration and profile configuration  Organization Portlet – user, group, and organization structure and permissions  Application Registry Portlet – application categories and permissions  Star Toolbar Portlet – toolbar button – select display language and site skin, or sign out• Interface Portlets  Banner Portlet – Organizational banner, icons, slogan  HomePage Portlet – (page as portlet??)  Navigation Portlet – navigation toolbar elements  Sitemap Portlet – Structured list of site pages  Breadcrumbs Portlet – Site navigation history, abbreviated  Iframe Portlet – Inline frames, external content  Dashboard Portlet – Portal gadgets container page, accessed from navigation toolbar  Gadget Wrapper Portlet – Gadget presentation in canvas mode (Canvas mode ??)  Footer Portlet – Site organization name, rights, etc
  12. 12. Acme Social Intranet Homepage (GateIn Demo)
  13. 13. Acme Social Intranet Homepage Analysis• Demo• Content is for internal use by employees• Limited presentational content• Streamlined workflow• Dashboard allows each user to select his or her own custom Google gadgets and other gadgets, like a Sandbox
  14. 14. Acme Social Intranet Agendas Page (GateIn Demo)
  15. 15. Acme Social Intranet Agendas Page Analysis• Conventional web-based calendar• GateIn Calendars can be read as iCal streams
  16. 16. Acme Social Intranet Wiki Page (GateIn Demo)
  17. 17. Acme Social Intranet Wiki Page Analysis• Self Contained Wiki in Intranet Portal
  18. 18. Acme Social Intranet Documents Page (GateIn Demo)
  19. 19. Acme Social Intranet Documents Page Analysis• Central management and intranet-local sharing for multiple types of media file – Documents – Music and Audio – Pictures – Video• Accessible with WebDAV (??)
  20. 20. Expanding on the Acme Model Directions for Component Integration• Portlets for Machine Generated Content, Dynamic Content• Reports  Aperte Reports• Workflow Integration  Aperte Workflow• Knowledge Management in Web 2.0  Ontopia  OWL API  Apache Stanbol  Maui Indexer  DCMI Project Management  EmForge

×