Wednesday, April 9, 2014

Nansen Wintercamp day 4 - the result



So now you have read about our first three days at the Wintercamp. The fourth day was also the last day and the last chance to wrap up all the tasks we have started here at Koppars.


The very last show-n-tell at Koppars.
Here is the result of our four days of the first ever Nansen Wintercamp.

Updated workflow UX -> frontend -> backend
Our new UX-frontend-backend workflow
What we were aiming for was a completely integrated workflow where a UXer can edit and change a template/wireframes and it gets updated automatically to the EPiServer CMS codebase that is being in development. But for a few reasons we strayed away from that since there is too much logic, .NET and CMS specific stuff in those templates for that to work well.

Instead we kept the wireframe tool in it's current PHP-state and 'just' included it into the Encore framework so that when a client project is started the framework is installed with the wireframe tool and UX:ers work with that.

The advantage is that the UXer freely can build and iterate the wireframes with the client and just check it in to the Encore environment. The build server then pushes the updated wireframes to the preview-server.


Updated EPiServer Encore framework

- A bit of cleaning up.
- Integrated the wireframe tool into the installer. 
- Created batch scripts that handles easy checking out and comitting wireframes for front-enders and UXers into the new workflow.
- Added "Do you want to install Commerce? Y/N" in the installation process.

Four new cases for the Nansen.com site

Caseimages
- Fastighetsbyrån (both Swedish and English)
- Electrolux (both Swedish and English)
- Bonniers (both Swedish and English)
- Stockholm Vatten
- Images where photographed for the cases as well.

Updated wireframe tool (still unnamed)

Our wireframe tool got revamped.
- Enhanced performance
- Revised grid system. We went from generating a unique grid for each project via LESS to include a predefined 12 column grid.
- Additional grid created for more complex/assymetric designs.

The gridsystem for more complex designs.
- Created "sitemap" functionality.

The sitemap can be built in the wireframe tool and all the pages exists as virtual pages that the client can clickthrough,

First test of drag-n-drop interface for the wireframe tool

- It looks like there is a possibility of achieving drag-n-drop functionality by using HTML5 and JavaScript/jQuery. More tests and research is needed before we have something to actually test. But really promising.

Improvements to moduler.js (library used by Boilerplate)

Hurray! First official release of moduler.js as opensource.
- Added documentation for the library.
- Improved build scripts using GulpJS.
- Released first public version, 0.1.0!

Commerce installer

Now EpiServer Commerce is a part of the Nansen Encore framework.
- Built a Power Shell based installer that completely automates the previously tedious and manual Commerce installation. The manual process could take two days for a first timer and multiple hours for an experience installer.
- The installer is also integrated in the Encore Framework.

Trello, Jira, sprints and wireframes

Discussions were initiated about how we can improve and work better with our clients in Jira and Trello in our sprints/projects.

We also discussed and drafted rules on where the wireframe-tool annotations end and where Jira or Trello starts so that we don't have duplicated information or build duplicate functionality in the wireframe tool.

And that's about it for the last day at the Wintercamp, now we are just preparing the last supper and then it's the last hang out in the kitchen playing the "lapp game". Tomorrow is sunday and the day when we head home to Stockholm, Linköping, London and Chicago.