Kickoff (generally 1-2 weeks)
Designer assigned Basecamp project
Receive Completed Discovery docs from client
Determine Discovery Call date/time w/ PC
PC schedules call
Create a new project within Figma > “Active Projects.” Name project using “jsource_domain” format. Within Figma, go to “WebSol Templates” > “Showcase Templates.” Right-click the desired Showcase Template > select “Duplicate.” Drag the copy to the FI project within “Active Projects”. Rename file to “jsource_domain”
Prepare and complete Discovery Call Outline
Open client Figma file and select “Sitemap” Page. Create a Kick-Off Sitemap for Discovery Call (update sitemap features and add a section listing purchased components).
When complete save as FI_sitemap-kickoff.pdf - smallest file size
Prepare any additional notes or questions to discuss with the client on the Discovery Call.
Discovery (60 min)
Complete Discovery Call. Learn client goals for sitemap, color placement, fonts, components
After Call, Recap with PC thru Zoom or Slack
Post Recap to Basecamp.
Design/Sitemap (generally 4-6 weeks)
Initial Sitemap (Delivered 5-7 days after Discovery Call)
Open client Figma file and select “Sitemap” Page.
Review Discovery doc/call notes to determine angle of new sitemap
Place new main navigation categories (max of 5 categories and 4 groups)
Place pages and organize components (within main navigation, additional pages, footer)
Update Email Collection Form (Yes/No)
When complete save as FI_sitemap.pdf - smallest file size
Copy canned message from Designer Resources and attach PDF - Edit canned message to apply to client Sitemap Delivery (Post-Discovery) - Web Designers
Post to BC w/ canned message and Sitemap Approval document.
Sitemap Revisions (2-4 business day turnaround for revisions)
Receive Sitemap Edits from client
Review Feedback / Decide if discussion or Call is needed. Work with PC, and schedule call with Client.
- Discuss changes during call - Recap after call with clear list of revisions you will be working on/or note anything you are waiting on from the client.
Make necessary updates to Sitemap and post to Basecamp w/ Sitemap Approval
Up to 3 rounds of revisions.
Receive Sitemap Approval. Coordinate with PC on client “Thank You” message and relay next steps to client.
Note - Rounds of revisions should not go over 3 versions without additional charge to the customer. Max amount should be as follows; Initial Sitemap, Sitemap v1, Sitemap v2, Sitemap v3
Initial Design (Delivered 5-7 business days after Discovery Call - sending 2-3 days after sitemap delivery)
Open client Figma file.
Download logo from BC and apply to the “Symbols” page.
Update theme Color Styles globally within the “Homepage” page example. Review Major, Minor, and Accent colors styles based on Discovery call notes and ADA contrast guidelines. Default minor color shown on “minor finder” frame example.
Add purchased components to the homepage. Access homepage components under the “Components” page. Update placement of editable content areas. (if applicable)
Within the “Subpages” page, keep purchased layouts in the file. Delete layouts that are not applicable/purchased to project. (if applicable)
Add cell component(s) to the general subpage. Access homepage components under the “Components” page. Update placement of editable content areas. (if applicable)
Update footer with FI information/preferences (routing, phone, social media, Banno Monitor).
Update fonts to match FI brand guidelines. (if applicable)
Update Style Guide with FI branding/components (logo, color hex, fonts, component asset sizes - when applicable)
Create design posting URL.
Copy Design Delivery canned message from Designer Resources. Edit canned message to apply to client.
Post to BC w/ canned message, Posting URL and Design Approval document.
Design Revisions (3-5 business days turnaround for revisions)
Receive Design Feedback from client
Review Feedback / Decide if discussion or Call is needed. Work with PC, and schedule call with Client.
- Discuss changes during call - Recap after call with clear list of revisions you will be working on/or note anything you are waiting on from the client.
- Make necessary updates to Design and post updates to Basecamp w/ Design Approval. Up to 3 rounds of revisions
- Receive Design Approval. Coordinate with PC on client “Thank You” message and relaying next steps to client.
Export for Development (Within 3 days of receiving Sitemap + Design Approval)
Refer to Trello Cardfor Designer Pre-Development list
Attach final sitemap to Trello Card
Check that all Designs are completed
Theme Style Guide
Theme Branch & ATM Locator Pins and Export as .png files
Export & Create Favicons using RealFaviconGenerator and Download Favicon Package
Create “dev_assets” folder in finder. Add fonts, favicon package, and branch/ATM pins. Compress folder and attach dev_assets.zip file to Card
Clean Up Figma File and Make Dev Notes
Complete checklist on Trello
Post “Ready for Dev” Comment on Trello Card. Include: Link to FI Figma Project, Approved Posting URL, Tag PC and Chris Struyk
Double Check All Time is Logged for Project
Notify Chad when Fully Exported
Move card to bottom of “Showcase Site Backlog” on Trello.
Ad Design (Start thread within 1-3 days of receiving Sitemap & Design Approval; Initial ads delivered 5-7 business days after ad topics are decided)
Tailor canned message Website Ads (Suggested Topics) - Web Designers and send in a new “Website Ads” thread on Basecamp.
Once topics are received, create initial ad designs.
When ready for client review, select applicable Ad Frames and “Export” as PDF files. Combine individual PDFs into one file using Adobe Acrobat. When complete save as FI_ads.pdf - smallest file size.
- Ad Revisions: Receive feedback and make edits within 2-3 business days. Up to 3 Rounds of Revisions. Post updates to Basecamp w/ Ad Approval.
- Receive Ad Approval. Send “Thank You” message.
Designer UAT Review (Within 3 days of receiving site from development)
Receive UAT site from Dev in a Private Message on Basecamp. Complete Design/CMS review.
In Basecamp project, hit “Create a Text Document” and mark hidden to client. Label document with “WIP Designer Review - [ETA Completion Date]”
Copy/Paste links provided by dev as a review outline. Note your review browser and device(s).
Log in to the UAT CMS https://uat.banno.com/a/login
If there are any, delete/remove all Dev added assets within Assets. Upload assets from design files/demo assets to test.
Edit Homepage:
- Delete and Replace assets on the homepage.
- Check if Hero overlays are present with images you uploaded, if applicable.
- Test out if content areas are editable as you would like them as a user.
- Use the copy that was on your design and make sure everything matches.
- Make sure the CMS is functioning in the places as you would have expected, and/or how you explained it to the client
- Relay Edits in Basecamp
- Edit Style Guide Page:
- Review General Subpage Design with the Styles on this page. Check headers, buttons, fonts (weights) are correct.
- Delete and Replace assets on the Style Guide Page
- If page is not populated with assets from the Developer, Mockup the Style Guide page with the assets and headers that were approved on the design.
- Check if Hero overlays are present with images you uploaded, if applicable.
- Test out if content areas are editable as you would like them as a user.
- Use the copy that was on your design and make sure everything matches.
- Make sure the CMS is functioning in the places as you would have expected, and/or how you explained it to the client
- Note any necessary revisions in Basecamp note to developer
- Check Designs at Tablet, and mobile. Use different devices if applicable. Note edits in Basecamp.
- Finish writing review. Copy/paste review and any attachments as message on original dev thread. Send a notification to PC and Dev when complete through Basecamp.
Pre-Launch (final steps but not limited to)
When Ads are approved, export ad assets to a “cms_assets” folder. Use asset style names (ex. hero-mortgage.jpg). Full-width assets should be scaled to 1600px width during export.
Create & export an icon library totaling 20 icons, including those used in ads (transparent PNG saved at 200%, using “##px.png” ending; ## equaling the original size).
Create & export 10 subpage header images.
Upload all approved ad assets, subpage headers, icons, etc. into CMS Assets. Label all the assets in the CMS using asset/ad style name (hero, subad, subpage headers, icons, etc.) and include asset dimensions (ex. Hero - 1440 x 500px)
Write alt tag descriptions for each asset.
Remove all placeholder assets if uploaded during development or UAT Review.
If Banno Marketing was purchased, create ZIP of all assets and send to PC via hidden BC message.
Notify the PC that Ads/Assets are complete.
After Dev has completed UAT Review edits, confirm style guide is accurate. Export style guide as PDF.
Tailor canned message Style Guide Delivery, attach Style Guide PDF and send in a new “Style Guide” thread on Basecamp.
Add Style Guide to Web Solutions Team Sharepoint Folder