Private customer area developed in Yii Framework and SugarCRM

Client: Omitted for reasons of confidentiality. Electricity distribution company (Spain)

This work consisted in implementing an exclusive private area only accessible to customers from the corporate website of an electricity distribution company. This reserved area should display information to customers about their own contracts, monthly consumption and billing data, while should allow modification of its own basic user data.

In addition it was created a specific section for sales agents from this electricity company to allow them to subscribe new contracts and manage promotional codes that would be used later in different marketing actions.

Development based on Yii Framework

After a preliminary analysis it was decided to completely separate the customer area from ​​the rest of the corporate website based on WordPress, place it on a separate subdomain and start the development from scratch based on Yii Framework. Although the application was not going to be divided into frontend and backend nor was to have an API to communicate with other applications, the Yiinitializr advanced template was taken in order to allow future expansion and implementation of new features not yet planned, but likely due the growth my client was experiencing.

Error: Your Requested widget " ai_widget-6" is not in the widget list.

• [do_widget_area above-nav-left]
• [do_widget_area above-nav-right]
• [do_widget_area footer-1]
  • [do_widget id="wpp-4"]
• [do_widget_area footer-2]
  • [do_widget id="recent-posts-4"]
• [do_widget_area footer-3]
  • [do_widget id="recent-comments-3"]
• [do_widget_area footer-4]
  • [do_widget id="archives-4"]
• [do_widget_area logo-bar]
  • [do_widget id="oxywidgetwpml-3"]
• [do_widget_area menu-bar]
  • [do_widget id="search-3"]
• [do_widget_area sidebar]
  • [do_widget id="search-4"]
  • [do_widget id="ai_widget-2"]
  • [do_widget id="categories-5"]
  • [do_widget id="ai_widget-3"]
  • [do_widget id="ai_widget-4"]
  • [do_widget id="ai_widget-5"]
• [do_widget_area sub-footer-1]
  • [do_widget id="text-4"]
• [do_widget_area sub-footer-2]
• [do_widget_area sub-footer-3]
• [do_widget_area sub-footer-4]
• [do_widget_area upper-footer-1]
  • [do_widget id="search-2"]
  • [do_widget id="recent-posts-2"]
  • [do_widget id="recent-comments-2"]
  • [do_widget id="archives-2"]
  • [do_widget id="categories-2"]
  • [do_widget id="meta-2"]
• [do_widget_area upper-footer-2]
• [do_widget_area upper-footer-3]
• [do_widget_area upper-footer-4]
• [do_widget_area widgets_for_shortcodes]
  • [do_widget id="search-5"]
  • [do_widget id="ai_widget-6"]
• [do_widget_area wp_inactive_widgets]
  • [do_widget id="wpp-2"]
  • [do_widget id="text-1"]
  • [do_widget id="recent-posts-3"]
  • [do_widget id="categories-3"]
  • [do_widget id="archives-3"]
  • [do_widget id="icl_lang_sel_widget-3"]

Integration with SugarCRM

One of the main requirements and great feature of this design is that all the information displayed to users within the customer area is stored into a backend based on SugarCRM which is extensively described in another article from my portfolio: SugarCRM extensive customization for electricity marketer company.

Therefore, it was necessary to implement a SugarCRM <-> Yii Framework interface to integrate both solutions and to share customer data, contracts, consumption and billing data taken directly from the SugarCRM database, the Yii application acting as a presentation layer such information.

Responsive design based on Bootstrap framework

User interface has a clean HTML5+CSS3+jQuery design based on Bootstrap framework that is fully responsive, ie, adaptable to all kinds of devices, whether desktop PCs, tablets or other mobile devices such as smartphones. This provides a very light and fast application that meets the latest standards in web design and is fully accessible to every user.

Error: Your Requested widget " ai_widget-6" is not in the widget list.

• [do_widget_area above-nav-left]
• [do_widget_area above-nav-right]
• [do_widget_area footer-1]
  • [do_widget id="wpp-4"]
• [do_widget_area footer-2]
  • [do_widget id="recent-posts-4"]
• [do_widget_area footer-3]
  • [do_widget id="recent-comments-3"]
• [do_widget_area footer-4]
  • [do_widget id="archives-4"]
• [do_widget_area logo-bar]
  • [do_widget id="oxywidgetwpml-3"]
• [do_widget_area menu-bar]
  • [do_widget id="search-3"]
• [do_widget_area sidebar]
  • [do_widget id="search-4"]
  • [do_widget id="ai_widget-2"]
  • [do_widget id="categories-5"]
  • [do_widget id="ai_widget-3"]
  • [do_widget id="ai_widget-4"]
  • [do_widget id="ai_widget-5"]
• [do_widget_area sub-footer-1]
  • [do_widget id="text-4"]
• [do_widget_area sub-footer-2]
• [do_widget_area sub-footer-3]
• [do_widget_area sub-footer-4]
• [do_widget_area upper-footer-1]
  • [do_widget id="search-2"]
  • [do_widget id="recent-posts-2"]
  • [do_widget id="recent-comments-2"]
  • [do_widget id="archives-2"]
  • [do_widget id="categories-2"]
  • [do_widget id="meta-2"]
• [do_widget_area upper-footer-2]
• [do_widget_area upper-footer-3]
• [do_widget_area upper-footer-4]
• [do_widget_area widgets_for_shortcodes]
  • [do_widget id="search-5"]
  • [do_widget id="ai_widget-6"]
• [do_widget_area wp_inactive_widgets]
  • [do_widget id="wpp-2"]
  • [do_widget id="text-1"]
  • [do_widget id="recent-posts-3"]
  • [do_widget id="categories-3"]
  • [do_widget id="archives-3"]
  • [do_widget id="icl_lang_sel_widget-3"]

User management

In order to protect the information inside the customer area a fully automatic user registration system was implemented wich allowed them to sign up without involving anyone else in the whole process and verify the existence of a previous contract to prove the user is a customer verifying data from past invoices. Other features of user registration system included verification and forgotten password emails, remember user sessions for 15 days, user data modification, role-based authorization to differentiate regular users from sales agents, etc.

Screenshots

Below is a collection of screenshots showing other features offered by this customer private area: