The newest platform from Real Web Solutions, realigin, is an extremely powerful CRM/CMS that offers just about every web tool a real estate professional could wish for. This product and services website separates realigin from any other real estate tech companies in both aesthetics and performance.
I used Bootstrap framework at the core to ensure a perfect experience at any screen size.
Realigin has since been sold to an other company and is now being rebranded! I have added a live demo of the website since it is no longer available.
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-01.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/IMG_6964_edited.png” width=”1300″ height=”1006″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
The website was designed to give viewers a taste of what to expect from realigin, all while remaining friendly-feeling but tech-focused. The primary purpose is to push user sign-up.
During development, I made sure the forms were fun to interact with and easy to understand. This helped eliminate partially filled-out forms and kept the user’s trust through the sign-up process. Form validation is immediate and clear.
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-02.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-03.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
The product pages feature large images and illustrated icons to breakup the content. Subtle CSS animations on content pieces, plus the animated push-scrolling on desktop, make the pages engaging to navigate through.
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/realigin-09.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-04.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-05.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
The website’s content pieces breakup up in a fluid but “clever” way to keep the layout looking good on smaller devices. Notice how these three content pieces don’t just collapse down to 100%-wide on tablet, but reconfigure themselves in a more logical way:
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/image5_edited.png” width=”1034″ height=”1300″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/image3_edited.png” width=”1006″ height=”1300″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/realigin-08.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/05/realigin-06.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]
[image src=”http://ncpdesign.com/wp-content/uploads/2015/06/realigin-07.png” width=”1663″ height=”1131″ lightbox=”true” title=”realigin by Real Web Solutions” autoresize=”true” clickthrough=”true”]