A design tool for everybody! A bit of history… let’s put things in context Two and a half years ago, our team focus changed and opened up a brand new playing field for most of us. We had a strong background in building finance applications using various software architecture and technologies, and we were asked to support the new SAP user experience (UX) strategy led by Sam Yen, Chief Design Officer at SAP. In order to build applications with highly usable and attractive user interfaces (UI), we adopted a design-driven development methodology, positioning the role of user experience designers at the forefront of the application implementation. As happens quite often, this story began with a customer. We needed to provide a proof of concept for a new user experience in 48 hours. And guess what? The customer loved it! This new UX was user-centered and task-based. Each app focused on one task to simplify the user experience. Simple screens, with exactly what the user needs to perform a particular task. And with that in mind, SAP Fiori was born. We started by building the first wave of SAP Fiori apps. We built 25 five apps in just a few months, some even sooner, to showcase at Sapphire NOW in Orlando in May of 2013. We had incredibly positive feedback from customers. As our team acted as UX implementation consultants and helped other development teams with their user experience, this quickly became our full-time job. We implemented/provided consulting help for SAP Enterprise Central Component (ECC), SuccessFactors, and Ariba divisions in bringing SAP Fiori to them. Also, we built the UI for Travel and Expense App, the first app working on top of on-premise and on-demand back ends with a single UI code. And this was only the beginning. Then a strategic project arrived. We were getting new designs on a daily basis. Some were a complete overnight UI redesign, while others were not feasible from a technical perspective. Communication and collaboration were challenging. This caused a lot of frustration in the development and designer teams. Tempers began to flare! How could we improve the situation? How could we work through the daily changes, and also validate designs with users in the least amount of time? We developed a user research tool called Drive.SAP that allowed designers to easily share their designs with users and get feedback. And people loved it! Drive won 2014 Ux Awards People’s choice honorable mention award. We were VERY proud. BUILDing on success Ok, it is cool to be able to share your designs and get feedback. So why not take it even further? This is what we are doing with BUILD. BUILD is a collaborative design tool that enables non-technical users to create interactive prototypes with realistic sample data, making it easier to capture more accurate user feedback and jump-start development, all while incorporating Drive.SAP capabilities for user research directly in BUILD. BUILD consolidates design tools and best practices, from the perspective of both design and development. It enables non-technical users, such as UX designers, business analysts, and product owners to create application prototypes using intuitive drag and drop UI composition. It addresses key UX and front-end development pain-points by reducing design process resource requirements, limiting high cost front-end development requirements, and dramatically improving collaboration between design and development at all stages of the implementation. BUILD prototypes are rich HTML5 applications that run responsively on any device and can optionally be equipped with various enterprise services. The ability to plug-in user interface libraries enables the generation of prototypes with different frameworks, such as Angular and OpenUI5. Main features of BUILD Some of the features listed below are planned innovations while others are already included in our Beta1. Hey, we only started a short time ago!
- User research – enables users to collect feedback on prototypes from users and colleagues to ensure that they build prototypes that end users want. (This feature is already available in Beta1. You can use static images or import an Axure HTML prototype.)
- Analytics – features analytic tools that capture quantitative user data and provide stakeholders with a continuous, detailed understanding of user behavior and preferences. (Already available in Beta1.)
- UI composition – enables non-technical users to generate applications by creating user interfaces with reusable components, interactions, and rules without writing a single line of code. (This is a planned feature.)
- Data modeling – facilitates data binding and modeling. It can be used to practice traditional bottom-up application development where the user can use a new or existing data model. BUILD generates the user interface based on the data modeling. In addition, data modeling supports pre-defined templates from SAP. (This is a planned feature.)
- Collaboration– provides collaboration tools that allow users to share information and ideas and to quickly and efficiently provide feedback to each other in the context of the task at hand. (This is a planned feature.)
- Technology independence – designed to facilitate plugging in UI control libraries from different UI frameworks, such as OpenUI5, Angular Widgets, custom HTML controls, and so on. (This is a planned feature.)
- Extensibility– architected to allow creating new reusable components, share them with other users and defining custom UI libraries. (This is a planned feature.)
- UI guidelines and rules – helps users build compliant applications according to predefined UI guidelines, while taking into account the current context and usage statistics. (This is a planned feature.)
- Administration– allows users with administrator permission to set up and customize the platform, for example, by specifying the supported UI libraries, connecting to backend systems, user management, and so on. (This is a planned feature.)
- Project management – enables project owners to set up users, manage teams, create projects, and manage shared assets on a project level. (This is a planned feature.)
- Jumpstart development– Import your prototype UI code in WebIDE to productize it. After the prototype is complete and reviewed, it can be used as a specification. (This is a planned feature.)
Check out our BUILD YouTube Channel to learn more about the cool features mentioned above. BUILD technology BUILD is implemented using the MEAN technology stack:
- Mongodb – data persistency
- Express – wrapper for routing service requests
- AngularJS – used for the presentation layer
- Node.js – this is where the server-side logic resides
Each module has its own GitHub repository and publishes its build artifact to the BUILD repository. Each functional module has dependencies on the shell and shared components, but can function as a standalone application. Modules are also configured to consume the shared dependencies. Each module can inject its UI into the shell by adding menu options, routes, and so forth.
As a Cloud product, BUILD will soon be available on SAP HANA Cloud Platform (HCP) where it will be available to customers integrated with other development tools (such as WebIDE). Contributing (coming soon) We want to make BUILD an open source project, and you will be able to clone your own branch and customize it to your own requirements. What do you think about that? Please send us your feedback on our open source strategy! Moreover, if you feel your customizations may benefit the community, you will be able to submit bug fixes, enhancements, and new features to BUILD as GitHub pull requests. Each proposed contribution will then be reviewed and tested, and, if it meets our basic requirements, will be integrated into the up-to-date code-base. BUILD beta – What’s in it for me? Currently, we are calling for participation in our BUILD Beta1 program. This initial version is focused on user research and analytics. If you would like to check it out, or to simply see where we are, just send us an email at email@example.com, and you can be part of our adventure!