Carmichael Centre

Solution Features Document

Client: Carmichael Centre (http://www.carmichaelcentre.ie/) Project: Implementation of new Responsive Redesign UI and Features. Development on Drupal 7Platform. Responsive Redesign for Desktop/Tablet/Mobile. Contents VERSION CONTROL

Ver. Date Author Revision details 1.0 14/02/2013 Craig Ellis Document Creation 2.0 19/02/2013 Kevin Gough Updated Document. Text highlighted in yellow needs to be clarified between me and the client. Text highlighted in green are direct notes/queries for PP and the dev team. 3.0 22/02/2013 Kevin Gough Updated the document after I received some clarifications from Caroline. More are still pending. 3.1 05/03/2013 Piyush Poddar Added Queries for Kevin Issues TBD with Abhishek 3.2 06/03/2013 Kevin Gough Added answers for Piyush highlighted in blue 3.3 07/03/2013 Piyush Poddar Added further queries/ comments as “[PP|v3.3]: …” 3.4 08/03/2013 Kevin Gough Added more answers for Piyush and meeting notes in pink 3.5 12/3/12 Piyush Poddar Mostly discussed and agreed with Kevin Kevin Gough “[PP|v3.5]: …” 3.6 14/3/13 Piyush Poddar Removed queries and questions to NOTE wherever applicable and agreed. Remaining to be discussed with KG. 3.7 15/3/2013 Piyush Poddar Updations done during call with Kevin. Seems most queries and conflicts sorted barring 1-2 that AD needs to look at during his TA analysis. Project Overview &Objectives

1. The Carmichael Centre currently has a website @ http://www.carmichaelcentre.ie/. The website is comprised of various information pages about the organisation and their key services. The current website is built on the Content Management System Drupal 6 and the development of the redesign and the improved feature list of the system will be done on Drupal 7

2. We have created all the Desktop designs to show the layouts for the various inside pages.

3. The Site will be built with a Responsive design so the layout changes depending on what device a user is viewing the site i.e. Desktop, Tablet, or Mobile.

4. Build out the frontend designs in XHTML/CSS and the associated Drupal Templates based on the designs compatible in all the following Operating Systems & Web Browsers: Windows XP & 7 (Firefox 3+, Chrome Latest, Safari Latest, IE 7,8,9) and Mac (Firefox, Chrome, Safari)

5. Complete the application development of the website on the Drupal platform.

6. This document (Solution Features) is the primary scoping & requirements document and outlines the core features and scope of functionality being developed and should be read in conjunction with associated project requirement artefacts as outlined above. It is based on the outcome of discussions withinthe Carmichael Centre.

Document File name Latest version

UI Progress Carmichael Responsive Redesign UI Development 6.0 ReviewSignoffProgress v6.xlsx Sitemap Carmichael Responsive Redesign Sitemap v6.xlsx 6.0 UI and Functional Requirements

Frontend

1. Header a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-home-v02.jpg

c. Development platform/technology Drupal

d. features / sections d.i. Row of Static Links/Main Nav Bar d.i.1. Home d.i.2. Sector Supports d.i.2.1. This would have a dropdown/flyout menu associated with it (ref: https://dl.dropbox.com/u/710960/CarmichaelCentre/CC- desktop-home-v01-hover.jpg) which would display links to each of the Sector Support Overview pages. d.i.3. Online Library d.i.4. KnowledgeNET d.i.5. Membership

d.ii. Row of Static Links – Right side, above Logo Banner a.i.1. News a.i.2. Events a.i.3. Contact Us

Donate Button/Text a.i.1. Donate – Align-Right Placed below Contact Us, in front of Logo Banner, Link to Donate page.

d.iii. Search Bar d.iii.1. Searches all the pages of the site for a set of keywords and then returns the results on a Search Results page.

d.iv. Accessibility Icon d.iv.1. The larger “A” Iconincreases the text size across the whole site. The text size can be reduced by clicking the smaller “A” icon.The “A” in the rectangle icon changes the background of the page to black and the text to yellow as per the current live site. This is placed to the left of the Accessibility text label.

d.v. Social Media Links d.v.1. Social (needs to be changed in Markups) Label with links to Carmichael Centre social media sites, situatedin area above the header which has links to other sites such as: d.v.1.1. Facebook – https://www.facebook.com/CarmichaelCentre d.v.1.2. Twitter – https://www.twitter.com/CCVoluntaryOrgs d.v.1.3. YouTube - http://www.youtube.com/user/CarmichaelVideos d.v.1.4. LinkedIn - http://www.linkedin.com/company/carmichael-centre-for- voluntary-groups d.v.2. This should link to the Carmichael page on these sites.

e. Carmichael Logo & Text e.i. Static for all pages. Linked to the Home page. e.ii. On the Sector Supports pages, Logo & Banner color changes, Text in the Banner also changes to the Sector Supports title.

f. Breadcrumbs f.i. Breadcrumbs on every page except the Home page. Placed under the header banner & Main Nav.

2. Footer a. Wireframe mockup screen(s) ??

d. features / sections d.i. 3 Columns of Static Content d.i.1. Left Column – “Contact Information” 3 Rows d.i.1.1.1. Carmichael House, North Brunswick Street Dublin 7 (Telephone Icon) 01-8735702 d.i.1.1.2. Coleraine House, Coleraine Street, Dublin 7 (Telephone Icon) 01-8735285 d.i.1.1.3. (Email icon) [email protected]

d.i.2. Middle Column – “Map 1 Row d.i.2.1.1. Google Maps embedded Map to Main Location

d.i.3. Right Column – “Stay in the Loop” d.i.3.1. Social Media Icons d.i.3.1.1. Facebookhttps://www.facebook.com/Carmichae lCentre d.i.3.1.2. Twitter – https://www.twitter.com/CCVoluntaryOrgs d.i.3.1.3. YouTube - http://www.youtube.com/carmichaelcentre/ d.i.3.1.4. LinkedIn - http://www.linkedin.com/company/carmichael-centre- for-voluntary-groups?trk=top_nav_home d.i.3.2. Subscribe d.i.3.2.1. Subscription Text d.i.3.2.2. Email Text Box d.i.3.2.3. Subscribe Button – submits the email address to the Drupal DB.

d.i.3.3. 2 lines of text d.i.3.3.1. Charity Number d.i.3.3.2. Charity Registration Number

d.ii. Sub Footer ( STATIC links) d.ii.1. Copyright Information Text d.ii.2. Privacy Policy link d.ii.3. Disclaimer link d.ii.4. “Designed & Developed by” Monsoon Consulting logo linked to our site.

d.iii. *The Footer is the same for all pages except the Contact Us Page d.iii.1. Same Functionality, Social Media re-arranged, etc. 3. Home a. Wireframe mockup screen(s) ??

d. features / sections d.i. Slider Block d.i.1. Intro slides d.i.1.1. content type : CMS managed d.i.1.2. An Auto play carousel. d.i.1.3. Each slide would contain: d.i.1.3.1. Title d.i.1.3.2. Description d.i.1.3.3. Image d.i.1.3.4. “Read More” link at the end of the text field. d.i.1.4. The whole slide (text and image) can be linked ( a field that for a hyperlink ) d.ii. “News” block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. “KnowledgeNET Blog” block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iv. “Latest on Social Media” RightBlock d.iv.1. content type : 3rd party plug-ins

d.iv.2. We would use the FacebookLike Box here. d.iv.2.1. URL: https://www.facebook.com/CarmichaelCentre

d.iv.3. We would use the Twitter API to pull data of the latest tweet from the Carmichael Twitter Page. d.iv.3.1. URL: https://www.twitter.com/CCVoluntaryOrgs note : the blue link “fb.me/…” in the design is part of the tweet message d.v. “Popular Searches” homepage block d.v.1. content type :Static

d.v.2. 2 rows of 5 columns displaying Icons.

d.v.3. All these icons would be clickable and would anchor to the specific page where the specific Search Item is located. note : the sections/pages that these links would be linking off to are also static and thus not deletable by the client admin users In fact all the pages ( listing pages, standard wysiwyg pages etc. ) that we deliver as they are mentioned I the sitemap document should not be deletable by the client admin users.;

d.v.4. This block would always display 10icons only

d.v.5. The icons will be hyperlinked.

d.vi. Other Links d.vi.1. content type :Static

d.vi.2. This block would display4 Icons/Logos and would be hyperlinked to the corresponding pages: d.vi.2.1. http://www.governancecode.ie/ d.vi.2.2. https://www.pobal.ie/Pages/Home.aspx d.vi.2.3. http://www.welfare.ie/en/Pages/home.aspx d.vi.2.4. The PQASSO logo should now link to the Quality Assurance page within the Training and Consultancy section.

d.vi.3. When not hovered, these Icons are faded grey to blend with the background colour.

d.vi.4. When hovered over, the icon/logo displays in its original colour.

4. Sector Supports a. Wireframe mockup screen(s) ?? b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-SS-v01.jpg

d. features / sections

d.i. Main Content Block d.i.1. content type : CMS managed

d.i.2. Page Title

d.i.3. Body text (WYSIWYG)

d.i.4. 6 rows for Sector Support areas, each with Image/logo, Title, subtitle and several lines pulled from their corresponding Overview pages.

d.i.5. The title, image, and “Read More ->” all link to the corresponding Overview pages.

d.i.6. Note* the images alternate from left to right of the text etc.

d.i.7. Note* the titles and images differ in colour depending on their sector.

Note: These sector support areas don’t need to be managed from admin. Adding new ones and removing existing ones is not required o the admin side. The colour/themes are fixed / static and would be bound to existing sector areas at the time of initial development only.

d.ii. Sector Supports RHS Nav Block d.ii.1. 2nd level Navigation links to Sector Supports areas

d.ii.2. Row format with a thin vertical strip to the left of each tab.

d.ii.3. The vertical strip is colour coded to the particular Support Services area as before.

d.ii.4. Each tab has a faded out icon to the RHS.

d.iii. News RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

5. Sector Support Overview i.e. Dublin HUB a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-dublinhub- overview-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop- corporateserv-overview-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-training- overview-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-social- overview-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-mentor- overview-v01.jpg c. Development platform/technology Drupal d. features / sections d.i. Intro Block d.i.1. content type : CMS managed d.i.2. Page Title d.i.3. WYSIWYG d.i.4. Video d.i.4.1. Image overlayed with Play icon. d.i.4.2. Title d.i.4.3. Text d.i.4.4. Opens in a Lightbox and plays d.i.4.5. Can be embedded from Youtube, Vimeo etc.

d.ii. Sections d.ii.1. content type : Static d.ii.2. Icons and Names in rows of 3 representing the various pages of the Sector Support d.ii.2.1. Each is linked to the relevant page PP:If sector support areas are dynamically manageable, will the changes get reflected here as well?KG: These are essentially child pages of Sector Supports, I think new child pages should be able to be created but not sure if these pages can have icons and that created here. Can they? [PP|v3.3]:keeping these all static would be the easiest approach. We can make these dynamic with additional efforts. Lets talk about this in the call. TBD. KG: Ok they definitely want to be able to create other Standard WYSIWYG pages on the site and these will more than likely fall under Sector Supports as child pages and thus need to appear in the RHS block. They also want to be able to create these little icons and names blocks when they are creating the new pages, a suggestion is that we can provide them a generic icon to use when creating these and if they want a custom icon they can come back to us. If this is going to impact the timeline then it can be done in Phase 2. TBD on our call. [PP|v3.5]: Abhishek to tech review and confirm. Don’t need to spend a lot of time in putting custom efforts, as we can defer the nice to haves to the next phase.

d.iii. *Note changes in colour depending on which Sector Support page the user is on. d.iv. RHS Nav Block d.iv.1. Refer to the “Blocks in Pages” section for the relevant block.

d.v. “Documents Download” Block d.v.1. Refer to the “Blocks in Pages” section for the relevant block.

6. Standard WYSIWYG a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-corporateserv-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-dublinhub-history-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-corporateserv-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-social-socialHUB-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-corporateserv- meetingrooms-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-mentor-process-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-disclaimer-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-training-governance- v01.jpg

d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Page Title – “HISTORY” for example. d.i.1.2. Body text (WYSIWYG) d.i.1.3. Themed Buttons

d.ii. RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. Download DocumentsRHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iv. Note* Changes in colour to the Logo, Banner and Headings.

d.v. Note* Meeting Rooms has an Enquiry Form Themed Button/Link.

d.vi. Note* Disclaimer Page – Nav Block not used – News Block and KnowledgeNET block used.

7. People – (Mentoring Scheme & Dublin HUB) a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-mentor-profile-v01.jpg https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-dublinhub-board-v01.jpg

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed

d.i.2. Page Title

d.i.4. People d.i.4.1. Image d.i.4.2. Name heading d.i.4.3. Role subheading d.i.4.4. Email d.i.4.5. Text (WYSIWYG)

d.iii. “Documents Download” Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

8. Digital Archive a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-dublinhub- digitalarchive-images-details-v01.jpg

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Title

d.i.1.2. “See All Image Albums” link – linked to the Albums page

d.i.1.3. Displays the latest 6 albums d.i.1.3.1. 2 rows with 3 columns of Images d.i.1.3.2. Title of album below each Album Image. d.i.1.3.3. Each album cover image and the album title is a link to the whole album. d.i.1.4. “See All Videos” link – linked to the Videos page

d.i.1.5. 4 rows displaying the latest 4 videos added with image (and set play icon overlayed) to the LHS and Video title and description to the RHS of the image. d.i.1.5.1. When the image is clicked then the video opens and plays in a Lightbox. d.i.1.5.2. These videos are embedded from Youtube, Vimeo etc. d.i.1.5.3. The user can click to next and previous videos from within the lightbox

d.ii. Dublin HUB RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. Download Documents RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block

9. All Albums a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-dublinhub- digitalarchive-images-v01.jpg

d.i.2. Page Title

d.i.3. Displays the latest 12 albums d.i.3.1. 4 rows with 3 columns of Images d.i.3.2. Title of album below each Album Image. d.i.3.3. Each album cover image and the album title is a link to the whole album.

d.i.4. Pagination.

10. Album Details a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-dublinhub- digitalarchive-images-v01.jpg

d.i.2. Page Title

d.i.3. Displays all the images of the album d.i.3.1. Images are displayed left to right in 3 columns d.i.3.2. Caption of each image is below d.i.3.3. When the image is clicked then the image opens and displays in a Lightbox. d.i.3.4. The user can click to next and previous images in the same album from within the lightbox

11. All Videos a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-dublinhub- digitalarchive-videos-v01.jpg

d.i.2. Page Title

d.i.3. 6 rows displaying the latest 6 videos added with image (and set play icon overlayed) to the LHS and Video title and description to the RHS of the image. d.i.3.1. When the image is clicked then the video opens and plays in a Lightbox. d.i.3.2. These videos are embedded from Youtube, Vimeo etc. d.i.3.3. The user can click to next and previous videos from within the lightbox

d.i.4. Pagination

12. Meeting Rooms Enquiry Form – details to be added but here’s the Markup link in the interim http://design.monsoonconsulting.in/carmichael/demo/meeting-rooms-enquiry-form.html [PP|v3.5]: Craig /KG to update more details.

13. Scheduled Training a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-training-scheduled- v01.jpg

d.i.2. Page Title

d.i.3. Search Bar Text Input Field

d.i.4. Drop Down Category List Note : categories to be dynamically managed d.i.4.1. Carmichael Centre FREE Seminars d.i.4.2. Communications and Promotion d.i.4.3. Governance and Leadership d.i.4.4. Managing Money d.i.4.5. Managing People d.i.4.6. Planning and Quality

d.i.5. Apply Button

d.i.7. 2 columns of Training Events for each category area, displaying all the events scheduled per category d.i.7.1. Calendar Icon with the Month & Date, or “ONR” or “TBA” d.i.7.1.1. Text can be added underneath when it’s “ONR” / “TBA” d.i.7.2. Event title d.i.7.3. Time d.i.7.4. This information is pulled from the Event details nodes d.i.7.5. These should be Ordered manually. NOTE : Manual ordering (provide a field ( “sort order” or “weight” ) in the events edit form that would accept a number that would used for the sorting. Same for the categories sorting as well? ) to be implemented if a drag and drop sort feature is not feasible easly.

d.iii. Download Documents RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block

14. ScheduledTraining Details a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-training-scheduled- details-v01.jpg

d.i.1. Main Content Block d.i.1.1. content type : CMS managed d.i.1.1.1. Title d.i.1.1.2. Body text (WYSIWYG) d.i.1.1.3. Calendar Icon with the Month & Date, or “ONR” or “TBA” d.i.1.1.3.1. Text can be added underneath when it’s “ONR” / “TBA”Training Event Title d.i.1.1.4. Location d.i.1.1.5. Time d.i.1.1.6. Trainer d.i.1.1.6.1. Staff Member Profile (WYSIWYG) d.i.1.1.7. Target Audience (WYSIWYG) d.i.1.1.8. Outcomes (WYSIWYG) d.i.1.1.9. Fees (WYSIWYG) - Table d.i.1.1.9.1. Group Column Heading d.i.1.1.9.2. Cost Column Heading d.i.1.1.9.3. Row Layout d.i.1.1.9.4. Event title d.i.1.1.9.5. Cost d.i.1.1.10. Map / Directions d.i.1.1.10.1. WYSIWYG d.i.1.1.10.2. Google Map d.i.1.1.11. Booking Information (WYSIWYG) d.i.1.1.12. “Book Online” Button linked to Training Booking Form NOTE : Button could be enabled/disabled via a checkbox on the specific training edit form. If enabled the button would always link to the Training Booking Form. The current event would not be passed to the form and the user would always need to the select the event again from the list in the form as depicted in the template.

d.i.1.1.13. “Return to Course List” linked to Scheduled Training page

15. Training Booking Form a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-training-booking- v01.jpg

d.i.1. Intro Block d.i.1.1. content type : CMS managed d.i.1.1.1. Page Title d.i.1.1.2. Body text (WYSIWYG)

d.i.2. Intro Block d.i.2.1. content type : CMS managed d.i.2.1.1. Name – mandatory d.i.2.1.2. Job Title d.i.2.1.3. Email – mandatory d.i.2.1.4. Organisation d.i.2.1.5. Organisation’s Address d.i.2.1.6. Telephone d.i.2.1.7. Fax d.i.2.1.8. “Type of Organisation”radio buttons(change in markups) d.i.2.1.8.1. Carmichael Centre Members and Associate Members -A d.i.2.1.8.2. Voluntary and Community Groups with no paid staff -B d.i.2.1.8.3. Voluntary and Community Groups employing staff -C d.i.2.1.8.4. FÁS Project Participants and Statutory Sector Staff -D d.i.2.1.9. “I would like to provisionally book a place on the following course:” dropdown – mandatory d.i.2.1.9.1. Select… and a Selection of Courses d.i.2.1.9.2. The siteadmin needs to have control over this dropdown so they can add/remove/edit options as they please.

Note : these courses are not being populated from the events nodes but rather as a separate entity. The admin would be able to manage them separately via the admin d.i.2.1.10. “No. of Participants:” dropdown – mandatory (change in markups) d.i.2.1.10.1. Select… d.i.2.1.10.2. One d.i.2.1.10.3. Two d.i.2.1.10.4. Three d.i.2.1.11. “Please indicate if you require the following:” Checkboxes – optional (change in markups) d.i.2.1.11.1. Wheelchair Access d.i.2.1.11.2. Special dietary needs d.i.2.1.11.3. Large type print handouts d.i.2.1.11.4. Any Other d.i.2.1.12. “I understand the terms and conditions of the Carmichael Centre Cancellation Policy” checkbox – mandatory d.i.2.1.12.1. “Cancellation Policy” hyperlinked to another page with the text. d.i.2.1.13. “Payment Method” Radio Buttons – mandatory d.i.2.1.13.1. I would like to be invoiced and pay by Cheque. Cheques should be made payable to Carmichael Centre. d.i.2.1.13.2. I would like to be invoiced and pay by Credit Card. d.i.2.1.14. CAPTCHA Authentication Image d.i.2.1.14.1. Text box - Required d.i.2.1.15. Book Now Button/Link– Submits the information above and stores it in the Drupal DB. This information should be available in a report in the backend. Also sends an email to [email protected]. A thank you page needs to be displayed to the user. [PP|v3.3]: lets create the thank you page templates as well, as later they are always need to be created anyhow. KG: A Thank you page is required but an email to the user is not required, I’ve added that point above. TBD ABhishek

16. Online Library a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-online-library-v01.jpg

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Page Title d.i.1.2. Search Bar – Functionality – Search through the displayed documents through keywords and associations. Input Text Area with a search Button. d.i.1.3. WYSIWYG d.i.1.4. 2 Column Table with “Category” and “No. of Files” headings d.i.1.5. Alphabetical list of Categories with No. of Files shown d.i.1.6. Each Category list item is a linked to that category page. d.i.1.7. The amount of files in the category is displayed under the No. of files title. d.i.1.8. Functionality – Admin can add/remove/edit category pages and files to those categories which then updates this list.

d.ii. “News” RHS Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. “KnowledgeNET Blog” RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

17. Online Library Category Files a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-online-library-detail-v01.jpg c. Development platform/technology Drupal

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Page Title d.i.2. List of Files – Row format – Each file contains d.i.2.1. Image – download file from the website d.i.2.2. Title – download file from the website d.i.2.3. Description d.i.2.4. File Icon and label automatically generated based on the file type d.i.2.5. Download Button – download file from the website

d.ii. “Library Categories” RHS Nav Block d.ii.1. List of Library Categories – Set max amount to 12 shown d.ii.2. “View All Categories” – Accordion effect that displays the rest of the categories.

NOTE : These categories are to be mangeable separately from the admin

d.iii. News RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

18. Membership a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-membership-v01.jpg

d.i.2. Page Title

d.i.3. WYSIWYG

d.i.4. Organisations in Row display – display All – Accordion Style d.i.4.1. Organisation Name d.i.4.2. Logo d.i.4.3. Description d.i.4.4. Hyperlink to website

NOTE : These Organisations are dynamic and can be manged by the admin ( add / modify , remove, sort )

d.ii. “News” RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

19. News Listing a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-news-listing-v01.jpg

d.i.2. Page Title

d.i.3. News Articles in Row display – Max 5 displayed d.i.3.1. Image – linked to details page d.i.3.2. Title – linked to details page d.i.3.3. Date published d.i.3.4. Text pulled from News Details – set max characters pulled d.i.3.5. “View Full News ->” – linked to details page

d.i.4. Pagination

d.ii. “Latest News” RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

20. News Details a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-news-details-v01.jpg

c. Development platform/technology Drupal d. features / sections

d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Page Title d.i.1.2. Date d.i.1.3. Body text (WYSIWYG) d.i.1.4. Share button (same as Events details, needs to be added in the Markups) – when clicked displays the social media icons so the event page URL can be shared using the relevant API.

NOTE : Same share this functionality as on knowledgenet site ( Share This module )

d.ii. “Latest News” RHS Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

21. Events Listing a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-events-v01.jpg

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Page Title d.i.1.2. Body text (WYSIWYG) d.i.1.3. Event nodes d.i.1.3.1. Calendar Icon with the Month & Date, or “ONR” or “TBA” d.i.1.3.1.1. Text can be added underneath when it’s “ONR” / “TBA” d.i.1.3.2. Event Title d.i.1.3.3. Location d.i.1.3.4. Time d.i.1.3.5. Image d.i.1.3.6. Detail d.i.1.3.7. This information is pulled from the Event details nodes d.i.1.3.7.1. The date field could instead also display “ONR” / “TBA” if set from admin

d.i.1.3.7.2. The sort order would be handled by the admin NOTE : Manual ordering (provide a field ( “sort order” or “weight” ) in the events edit form that would accept a number that would used for the sorting. Same for the categories sorting as well? ) to be implemented if a drag and drop sort feature is not feasible easly.

d.ii. “Event Listing” RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. “News” RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iv. “KnowledgeNET Blog” RHS Block d.iv.1. Refer to the “Blocks in Pages” section for the relevant block.

22. Events Details a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-events-details-v01.jpg

d.i.1. Main Content Block d.i.1.1. content type : CMS managed ( separate fields ) d.i.1.2. Page Title d.i.1.3. Calendar Icon with the Month & Date, or “ONR” or “TBA” d.i.1.3.1. Text can be added underneath when it’s “ONR” / “TBA” d.i.1.4. Location d.i.1.5. Time d.i.1.6. Image d.i.1.7. Body text (WYSIWYG) d.i.1.8. Speakers d.i.1.8.1. Image d.i.1.8.2. Text (WYSIWYG) d.i.1.9. Agenda d.i.1.9.1. WYSIWYG d.i.1.10. Map / Directions d.i.1.10.1. WYSIWYG d.i.1.10.2. Google Map

d.i.1.11. Book Online button linked to the Events Booking Form ( no need to pass the current event id / name etc. to the form dynamically. )

d.i.1.12. Share button – when clicked displays the social media icons so the event page URL can be shared using the relevant API.

NOTE : Same share this functionality as on knowledgenet site ( Share This module )

d.ii. “Event Listing” RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. “News” RHS Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iv. “KnowledgeNET Blog” RHS Block d.iv.1. Refer to the “Blocks in Pages” section for the relevant block.

23. Events Booking Form a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-events-booking- v01.jpg

d.i.1. Intro Block d.i.1.1. content type : CMS Managed d.i.1.1.1. Page Title d.i.1.1.2. WYSIWYG

d.i.2. Webform d.i.2.1. content type : Static d.i.2.1.1. Personal Information d.i.2.1.1.1. Name – Mandatory [PP|v3.3]: Well there is no name field in the markups but a title dropdown. I think this is a mistake and there should be a textbox instead. Please confirm. KG: Yes, there should be a textbox called Name.

NOTE : remove the 2nd field (Organisation) and the 3rd field ( Title) from the markups http://design.monsoonconsulting.in/carmichael/demo/events -booking.html

d.i.2.1.1.2. Address – Mandatory d.i.2.1.1.3. Billing Address – Mandatory d.i.2.1.1.4. Organisation d.i.2.1.1.5. Telephone d.i.2.1.1.6. Mobile d.i.2.1.1.7. Email – Mandatory d.i.2.1.2. Event Information d.i.2.1.2.1. Event Name – Dropdown – Mandatory d.i.2.1.2.1.1. The admin should be able to add/delete/edit the options in this dropdown list as they please. d.i.2.1.2.2. Price Per Attendee – Auto Generated by drop down list selection – Mandatory d.i.2.1.2.2.1. The admin should also be able to set the corresponding Price Per Attendee when creating the Event Names as per the above. d.i.2.1.2.3. No. of Attendees – Number only input – Mandatory d.i.2.1.2.4. Fees – Calculated by Price Per Attendee multiplied by No. of Attendees – Mandatory d.i.2.1.2.5. Delegate Name – Mandatory d.i.2.1.2.6. Delegate Email – Mandatory d.i.2.1.2.7. Location – Mandatory d.i.2.1.2.8. Role – Mandatory d.i.2.1.2.9. Add Delegate – Button – Create more fields for Delegate Name, Delegate Email, Location, andRole

[PP|v3.7]: There were issues in ET project while making any of the delegates field mandatory would need all the delegates to be enabled. Lets talk about this. Abhishek to look into this and try fixing it here as well as on ET as well. d.i.2.1.3. Credit / Debit Card Information d.i.2.1.3.1. The following fields below are not displayed if the amount in the Fees field is 0. d.i.2.1.3.2. Cardholder Name – Mandatory d.i.2.1.3.3. Card Type – Dropdown – Mandatory d.i.2.1.3.3.1. Visa / Visa Debit d.i.2.1.3.3.2. MasterCard d.i.2.1.3.3.3. Laser d.i.2.1.3.4. Card Number – Number input only d.i.2.1.3.5. Expiration Date – Month Drop Down List d.i.2.1.3.5.1. January to December d.i.2.1.3.6. Expiration Date – Year Drop Down List d.i.2.1.3.6.1. Next 10 years i.e. 2013 – 2023 d.i.2.1.3.7. Security Code – Mandatory(Unless Laser is selected in Card Type) – Numbers only d.i.2.1.4. Image – Security Code location on Card Image d.i.2.1.5. Text – (Explanation of the security code) d.i.2.1.6. CAPTCHA – Security text d.i.2.1.6.1. Code Input Box d.i.2.1.6.2. Text – Explanation and Directions about CAPTCHA code d.i.2.1.7. Book Now Button submits the info given above (except the Credit / Debit Card Information) to the Drupal DB and this should be available to view in a report in the backend.An email should always be sent to [email protected][email protected] and the user. The user should also see a Thank You page if successful. d.i.2.1.7.1. The Credit / Debit Card Information is sent to Realex (or another Payment Gateway Provider) to process the payment.Has the client created an account with Realex yet? [PP|v3.3]: Please confirm the Realex account details, going forward. KG: The update from Caroline is that they are still waiting on Elavon to set up their Merchant Account. Once this is done and the Merchant Number is provided to Realexthen Realexwill create the account. Can we integrate with a generic Realex test account in the interim or do we need a Carmichael specific test account? Let’s discuss on the call. [PP|v3.7]: Lets use Monsoon Test Realex details temporarily till we get the Carmichael accounts.

d.ii. “Events” RHS Nav Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iii. “News” Block d.iii.1. Refer to the “Blocks in Pages” section for the relevant block.

d.iv. “KnowledgeNET” Block d.iv.1. Refer to the “Blocks in Pages” section for the relevant block.

24. Contact Us a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/CC-desktop-contact- v02.jpg

d. features / sections d.i. Main Content Block d.i.1. content type : CMS managed d.i.1.1. Description text d.i.1.2. Personal Information d.i.1.2.1. First Name d.i.1.2.2. Last Name d.i.1.2.3. Email d.i.1.2.4. Phone d.i.1.2.5. Organisation d.i.1.2.6. Role in Organisation d.i.1.3. Address d.i.1.3.1. Address 1 d.i.1.3.2. Address 2 d.i.1.3.3. Area / Town d.i.1.3.4. City / County d.i.1.4. “My enquiry relates to (Select as appropriate)” checkboxes - 2 columns with 4 rows with labels d.i.1.4.1. Meeting Rooms d.i.1.4.2. Catering d.i.1.4.3. Office Accommodation d.i.1.4.4. Corporate Services d.i.1.4.5. Quality Assurance Support d.i.1.4.6. Training and Consultancy d.i.1.4.7. Mentoring Scheme d.i.1.4.8. General Enquiry d.i.1.5. “Your Message” Text Box d.i.1.6. “How did you hear about us?” Dropdown d.i.1.6.1. -None- d.i.1.6.2. Carmichael Centre Publicity d.i.1.6.3. Previous Carmichael Centre Engagement d.i.1.6.4. Internet d.i.1.6.5. Word of Mouth d.i.1.7. “Send Query” Button submits the info above to the Drupal DB and the info should be available in a report in the backend. An email needs to be sent to different people in Carmichael depending on what checkboxes have been selected under “My enquiry relates to”, the list of these people are below. Is that ok PP/AS/AD?No email is required to be sent to the user but a Thank You page should be displayed. [PP|v3.3]: Please confirm the email to the user and the thank you page and if we need to create templates for them as well. KG: No email to the user, just a Thank You page required.

d.i.1.7.1. Meeting Rooms - [email protected] d.i.1.7.2. Catering - [email protected] d.i.1.7.3. Office Accommodation - [email protected] d.i.1.7.4. Corporate Services - [email protected] d.i.1.7.5. Quality Assurance Support - [email protected] d.i.1.7.6. Training and Consultancy - [email protected] d.i.1.7.7. Mentoring Scheme - [email protected] d.i.1.7.8. General Enquiry - [email protected] d.i.1.8. This form is currently integrated with Salesforce. This integration will need to be continued on the new site. That ok PP/AS/AD? Do you need anymore info? [PP|v3.3]: We would use the same integration details that are being used in the current live site. KG: Ok let’s discuss. [PP|v3.7]: PP/Abhishek to check d.ii. LHS Contact Us Block d.ii.1. content type : CMS managed d.ii.1.1. Subtitle d.ii.1.2. Company Address (first line in bold) d.ii.1.3. Telephone d.ii.1.4. Fax d.ii.1.5. Email d.ii.1.6. Google Map plugin with the location of the Carmichael Brunswick Street office d.ii.1.7. Company 2ndAddress (first line in bold) d.ii.1.8. 2nd Telephone d.ii.1.9. 2nd Fax d.ii.1.10. Email d.ii.1.11. Google Map plugin with the location of the Carmichael Coleraine Street office d.ii.1.12. Company 3rd Address (first line in bold) {update the correct info} d.ii.1.13. Telephone (same as Carmichael House) {update the correct info} d.ii.1.14. Fax (same as Carmichael House) {update the correct info} d.ii.1.15. Email (same as Carmichael House) d.ii.1.16. Google Map plugin with the location of the Carmichael Brunswick Street office{update the correct info}

d.iii. Footer d.iii.1. Contact Details and Map removed from this footer to avoid duplication. d.iii.2. Other elements have been moved around but the functionality is still the same.

25. Donate a. Wireframe mockup screen(s) ??

b. Design https://dl.dropbox.com/u/710960/CarmichaelCentre/new/CC-desktop-donate- v01.jpg

d.i.1. Intro Block d.i.1.1. content type : CMS Managed d.i.1.1.1. Page Title d.i.1.1.2. WYSIWYG

d.i.2. Webform d.i.2.1. content type : Static d.i.2.1.1. Your Donation– Mandatory – Number Only d.i.2.1.2. Personal Information d.i.2.1.2.1. Title – Drop Down List – Mandatory d.i.2.1.2.1.1. Mr d.i.2.1.2.1.2. Mrs d.i.2.1.2.1.3. Ms d.i.2.1.2.1.4. Dr d.i.2.1.2.2. Name – Mandatory d.i.2.1.2.3. Surname – Mandatory d.i.2.1.2.4. Date of Birth – 3 drop down lists d.i.2.1.2.4.1. Month – January - December d.i.2.1.2.4.2. Day – 1 - 31 d.i.2.1.2.4.3. Year– 100 years ago up until 18 years ago i.e. 1913 - 1995 d.i.2.1.2.5. Email – Mandatory – Format Check d.i.2.1.2.6. “I would like to receive occasional news, program launches, and charities information” checkbox d.i.2.1.2.7. “I prefer to be contacted” checkboxes d.i.2.1.2.7.1. By Post d.i.2.1.2.7.2. By Email d.i.2.1.2.7.3. By Phone d.i.2.1.2.8. Address– Mandatory d.i.2.1.2.9. Town – Mandatory d.i.2.1.2.10. Country – Dropdown – Mandatory d.i.2.1.2.10.1. All countries d.i.2.1.2.11. County – Dropdown – Mandatory d.i.2.1.2.11.1. Counties of Ireland, if Ireland is not selected in the Country dropdown then this can be a free text field. d.i.2.1.2.12. Post Code d.i.2.1.2.13. Phone – Numbers Only d.i.2.1.3. Credit / Debit Card Information d.i.2.1.3.1. Cardholder Name – Mandatory d.i.2.1.3.2. Card Type – Dropdown – Mandatory d.i.2.1.3.2.1. Visa / Visa Debit d.i.2.1.3.2.2. MasterCard d.i.2.1.3.2.3. Laser d.i.2.1.3.3. Card Number – Number input only d.i.2.1.3.4. Expiration Date – Month Drop Down List d.i.2.1.3.4.1. January to December d.i.2.1.3.5. Expiration Date – Year Drop Down List d.i.2.1.3.5.1. Next 10 years i.e. 2013 – 2023 d.i.2.1.3.6. Security Code – Mandatory (Unless Laser is selected in Card Type) – Numbers only d.i.2.1.4. Image – Security Code location on Card Image d.i.2.1.5. Text – (Explanation of the security code) d.i.2.1.6. CAPTCHA – Security text d.i.2.1.6.1. Code Input Box d.i.2.1.6.2. Text – Explanation and Directions about CAPTCHA code d.i.2.1.7. Donate Now Button submits the info given above (except the Credit / Debit Card Information) to the Drupal DB and this should be available to view in a report in the backend.An email should be sent to [email protected] and a Thank You page should be shown to the user if successful. Note : No user notification via email.

d.i.2.1.8. The Credit / Debit Card Information is sent to Realex (or another Payment Gateway Provider) to process the payment. Has the client created an account with Realex yet? [PP|v3.3]: Please confirm. KG: See my comment above. [PP|v3.7]: to use MC test Realex account temporarily till we get the Carmichael details.

d.ii. “Documents Download” RHS Block d.ii.1. Refer to the “Blocks in Pages” section for the relevant block.

26. “Blocks in Pages”

a. RHS Nav Block a.i. content type : Dynamic

a.ii. This would display the 3rd level navigation links for the various pages on the site based on the current page you are on. NOTE : There would not be a 4th level navigation required in this phase.

a.iii. The links for each section have been detailed in the Site Map.

a.iv. Note* difference in colour to match the banner colour depending on which Sector Support section you’re in or if it’s a Main Site page.

a.v. Always displayed as the first block on the Sector Support pages etc.

a.vi. KG: Refer to my note on creating new pages on the site.

b. “Latest News” Block b.i. content type : Dynamic b.i.1. Block consists of the latest 5News Items b.i.1.1. News Title linked to the News Details page b.i.1.2. Date

b.ii. Can be turned on / off for any page that has RHS blocks

c. “Events” RHS Nav Block c.i. content type : Dynamic c.i.1. Block consists of the next 3 Upcoming Events c.i.1.1. Event title linked to the Event Details page c.i.1.2. Date

c.ii. Can be turned on / off for any page that has RHS blocks d. “Documents Download” Block d.i. content type : CMS managed

d.ii. This block would display the all the documents that have been enabled to be displayed in this block on relevant pages (single or multiple of the 5 sector areas ( except knoweldgenet) RHS blocks , Fund Raising page ( donate ) RHS block)

d.iii. A document can be featured in Multiple Sector Supports.

d.iv. This will be managed from a “Document Bank” in the admin

NOTE : Admin would be able to choose from the existing documents (online library) via checkboxes. The same set of documents would be displayed across all the pages within the same sector.

d.v. All these nodes would be clickable and would automatically download the Document.

e. “News” block e.i. content type : Dynamic

e.ii. This block would display the latest News item only.

e.iii. The following will bedisplayed e.iii.1. Image – hyperlinked to the News Details page e.iii.2. Title – hyperlinked to the News Details page e.iii.3. Text snippet from details page e.iii.4. Read More link – hyperlinked to the News Details page

e.iv. This is fixed in place on the LHS of the Home page but can be turned on / off for any page that has RHS blocks

f. “KnowledgeNET Blog” block f.i. content type : Dynamic

f.ii. This block would display the latest Blog item to be pulled in from knowledgenet.carmichaelcentre.ie only. After clicking on the blogpost link the user gets redirected to the post on the knowledgenet.carmichaelcentre.ie site directly.

f.iii. The following will be displayed f.iii.1. Image – hyperlinked to the Blog Details page f.iii.2. Title – hyperlinked to the Blog Details page f.iii.3. Text snippet from details page f.iii.4. Read More link – hyperlinked to the Blog Details page

f.iv. This is fixed in place in the middle of the Home page but can be turned on / off for any page that has RHS blocks

27. Other Functionality

a. Large Text and Small Text a.i. content type : Static

a.ii. This functionality is for increasing and decreasing the font size of the text across the whole site. And also for changing the colour to yellow and black?

a.iii. Icon is AAA with label - Accessibility.

a.iv. Note for Caroline: Design limitations mean likely layout break when switching from regular to large text. b. Document Bank b.i. content type : CMS managed

b.ii. There needs to be some facility for the siteadmins to be able to upload files onto the system then they can pick which ones to display on certain pages that have areas designed for files. Notable places are the Documents RHS block and the Online Library pages.

b.iii. The files from this doc bank could be published on any / multiple of the following locations via checkboxes ( 2 sets of checkboxes :

b.iii.1. 1st set to have all the categories, b.iii.2. 2nd set would have 6 checkboxes ( 5 sector areas ( knowledge net is not included ) + Fund raising page (donate))

b.iii.3. The association of these documents with the categories via checkboxes in admin would not be mandatory) Please note that these categories are manageable from the backend as well.

b.iv. The sorting of these documents would be managed from the backend via a global sorting order for all the documents. ( preferably using Drag & Drop Feature like node queue feature, but in the worst case this could be sorted via a simple weight field) Administration Interface Note : Standard site admin features. No workflow or workbench required.

User Roles To be added by PP or a Senior Developer

1. Super Admin

2. Master Admin

3. Site Admin

General 1. Google Analytics will be integrated on the site to provide reporting functionality. Refer to the live site for the specific code. The Google Analytics Login Details are: a. Username: [email protected] b. Password: CCVG2013

2. SEO ranking page listings need to be maintained through migrating the existing Meta Data and 301 redirects from current pages to new pages. Ned to map 301s. Caroline/Kevin to manage this. a. Standard Drupal SEO checklist needs to be referred to.

Hosting & Site Hierarchy 1. To be confirmed with Steve/Caroline. KG: Will be managed by Hosting Ireland. Same server as KnowledgeNET, is there capacity? OR Dedicated server with just KnowledgeNET and Carmichael Centre, cost implications?

Data Migration 1. Some page content may need to be migrated, the content from the following pages / sections need to be migrated. a. Training b. Resident Members c. Online Library d. Gallery / Video Wall e. News (Current Items)

2. Agree to keep the current website running for a month or 2 after Go Live just accessible via an IP address in case we need to get any leftover content.

3. Most of the other content will be posted on Basecamp by Caroline and Jennifer.

General Comments

The Operating Systems and Browsers that needs to be validated are Windows XP & 7 (Firefox 3+, Chrome Latest, Safari Latest, IE 7,8,9) and Mac (Firefox, Chrome, Safari)