Skip to content

After building IIA’s marketing site, our next project with them was to tackle their client portal – a site they use exclusively with paying clients. The original portal was built on ExpressionEngine; our job was to migrate it to Craft and make UI improvements where it made sense so that the site would have a better authoring experience and improved flexibility.

II Aportal 001 screens

UI Design

The original portal had a no-frills, simple, utilitarian design – all good things for a site of this type. Because of this, there wasn’t a crucial need to completely revamp the UI. Instead, our focus for design was to modernize it, use the marketing site’s design patterns, and only make improvements where it made sense, such as to improve the user experience.

Development

The bulk of the project was development. This involved building the content structure, migrating content, coding up the various screens, and lots (and lots) of testing.

Content structure

Our first step was to get familiar with the way content was organized and structured in ExpressionEngine (EE). That became our foundation for how to set things up in Craft. It’s not a 1:1 comparison by any means, but we were able to easily setup the needed fields and sections in Craft so that we could move on to content migration.

Content migration

Migrating content from one platform to another can be an… interesting experience. Fortunately there were two critical pieces at play that made this easier for the IIA Portal: Craft has a fantastic data import plugin in Feed Me and we have years of experience in both ExpressionEngine and Craft. So we coded up the various XML feeds in ExpressionEngine so those could be imported into the proper sections in Craft via Feed Me.

We then ensured to have those feed imports run on a regular basis to both the live Craft installation (i.e. the IIA main/marketing site) and the staging/test site. Why run the feeds on both? To make things easier on ourselves down the road. Because this is separate site but just one Craft install, having data for the new site in the live database/Craft setup wouldn’t get in the way of the live marketing site – it would just sit there. By importing the EE data into the live Craft setup over time, “launching” the portal site would simply be a matter of deploying files and making some adjustments to permissions and data connections.

II Aportal 003 code

Code

Once we had the data in the test site we started coding up the site. As mentioned previously, the general layout or UI didn’t change too much, so that part was done relatively quickly – we simply coded it to modern HTML and CSS standards rather than using older code. Then it was a matter of building out the different templates and screens for each section of the site.

The tricky part of the build-out was ensuring users were only seeing what they were allowed to see. There are various user groups for the IIA Portal and each one could only be allowed to view certain parts of the portal. While this is typically pretty easy, it was made slightly less easy due to having 7 user groups, not including site admins.

Testing… lots of it

Although the site overall isn’t super complex, the various user groups and data import are what made it a little tricky. We always go through a hefty testing phase with our web projects of course, but the IIA Portal required a bit more testing, back-and-forth with the awesome folks at IIA, and small fixes here and there. While that doesn’t sound like much, it added several weeks to the tail end of the project. The holiday breaks didn’t help with the schedule either. C’est la vie.

Final product

Launch went smoothly, partly because of the initial decision to import data from EE to the live site and not just the staging site, and partly because it was a single Craft installation. That way, all we had to do was deploy the files and config changes (timing it right with IIA’s IT folks) and make any needed adjustments.

The end-product is something we’re proud of and IIA is happy with. While there may be a few wrinkles to iron out with real people now using the portal, that’s normal and is exactly why we always provide a thirty-day support period after a site has launched.

II Aportal 009 mockup desktop II Aportal 011 mockup desktop II Aportal 007 mockup desktop II Aportal 012 mockup desktop