Lessons from Building Asterisk GUIs Presented by Gaston Draque
You Finally Built an Asterisk PBX SIP IAX SIP / IAX / FAX / TDM TDM Services Queues Ringgroups DIDs Routing etc Apps Services
Asterisk can be awesome! and like all things awesome
First thing s First Why do you need a GUI?
Less can be more!
But not Always GUI Cases OEM PBX PBX Addon: Conferencing, FMC, Voicemail, ACD, IVR, CDRs Switchvox Add-on FreePBX Module Service Oriented Architecture Portal Add-ons
Niche solutions
End User Admin User GUI Technical User
What do we want from a GUI? Device Provisioning Permissions Repository Application Management (voicemail, conferencing, etc) Extension Routing Media Management Extensibility
What do we want from a GUI? Media Management
Past Examples CRM Integrated Switchboard Plugin:
Past Examples CRM Integrated Switchboard Plugin:
Past Examples Feature Rich Commercial Conference Bridge: Key Elements User identification 4 profiles : clients, agents, supervisors and admins. Conference initiation Termination (leave/kick/end) Business Process driven
Past Examples Commercial Conference Bridge:
Past Examples Commercial Conference Bridge: User Portal - Home Before conference (owner) Create conference (MySQL) Global PIN conference (MySQL) Per user PIN conference (MySQL) Send invitations Assign DID to conference (ARA) During conference (owner) List users ( online / offline ) (AMI) Kick / mute / unmute (AMI) After conference (Owner) List / search unlocked conferences Assign billing-codes Add notes
Past Examples Commercial Conference Bridge: Admin Portal (show all) After conference (Admin) List / search conferences Locked / unlocked conferences Approve billing-codes -> Lock Modify/Assign billing-codes -> Lock Send reminders to Agents Store / download Locked sessions Add notes
Lessons Learned UI Lessons Technical Lessons PM Lessons
Lessons Learned UI Lessons Technical Lessons PM Lessons
Lessons Learned UI Lessons: Simplify
Lessons Learned UI Lessons: Convention over configuration How does 'Convention Over Configuration' applies to design? Define the process and take the risk Implement industry best practices when ever possible Make standard the rule, not the exception Handle exceptions like exceptions... they are exceptions! Handle detail level wisely
Lessons Learned UI Lessons: GUI as an abstraction layer Clustering Distributed services Multi-location Multi-tenant
Lessons Learned UI Lessons: Size matters Data layer impact GUI redesign Over simplification Grouping Drill-down tools Multi-level views, keep it within the scope and maybe not enough.
Lessons Learned UI Lessons: From UID Visual Design & Branding UID Information Design Interaction Design User Interface Design
Lessons Learned UI Lessons: From UID to UCDP Business Requirements/Goals UCDP User needs Technical Feasibility User-Centered Design Process
Lessons Learned UI Lessons Technical Lessons PM Lessons
Lessons Learned Technical Lessons: General aspects When in doubt, use a database and avoid flat files Keep your development libraries small and modularized Make your code re-usable Play to Asterisk s strengths as a powerful media server Avoid excessive use of AMI Learn to leverage SIP proxies and TDM Gateways
Lessons Learned Technical Lessons: Use ARA to standardize The Asterisk dialplan is great for dev, not for the GUI ARA will force you to standardize on a dialplan structure Weight the ARA issues impact on your solution. Ie: Include context blfs/hints peer/users not kept in memory text files over ARA entries NOTE: Asterisk 10 has good news for some of this issues!
Lessons Learned Technical Lessons: Dev framework,choose wisely Lightweight MVC Framework Community Light footprint Extensibility Documentation Flexible Licensing Methodologies associated with it
Lessons Learned Technical Lessons: Example; MVC for Agile methodologies DB Models Helpers Additional Library Views Controllers
HTML + EventDrivenContent Evolution WebSockets
AJAX: PULLING Client Id, state HTTP Server DB Loop Updated state (process) Loop COMET: LONG PULLING/STREAMING Client Id, state HTTP Loop Server DB Updated state (process) Loop HTML5: WEB SOCKET Clients Action, Recipientld HTTP Server Action, Recipientld Action, Recipientld (process)
Lessons Learned Technical Lessons: WebSockets its just a round the corner WebSockets: API is being standardized by the W3C protocol is being standardized by the IETF HTML5 WebSockets over polling and long-polling Scales betters Less server resources Simplifies solution architectures Less overhead, less latency Many browsers already support it Already existing libraries and WebSockets Gateways
Lessons Learned UI Lessons Technical Lessons PM Lessons
Lessons Learned PM Lessons: Adapt PM theory to PM practice PM methodologies!= Development methodologies Some Development Methodologies are better matches for GUI development Choose Agile vs Waterfall Choose anything over Cowboy coding (but its fun isn t it!) Keep in mind, this is a UI Asterisk is the engine, lets make the driver happy, means Fixes, new features and upgrades are frequent.
Lessons Learned PM Lessons: Tools should match many requirements Repository Kind of access Government style (aka. Git does not fit all needs) Versioning model Management tools Tasks Bug tracking Documentation
Thank You! GASTON DRAQUE gdraque@eusnetworks.com www.eusnetworks.com