Development on the Bulwark Design Framework.
Disclaimer: All designs in this post are either prototypes, alphas or otherwise unfinished and will be subject rapid change, these images are are not intended to be promotional material but only as a raw glimpse into an active development.
Hello.
Greetings and welcome to our first post on the Bulwark Design Framework, you may have seen it added to our roadmap recently and been wondering to yourself what is it exactly.
So worry not, I’m here to give a brief introduction and explain what the Design Framework is while outlining some of our planned tasks, and developments on it to date.
Hopefully by the end of this write-up you’ll have a better understanding of what we’re doing and what the BDF is.
So, What’s a design framework?
In the simplest terms a design framework is a set of tools for developers to utilize which enables them to build a more cohesive software experience that is more easily understood by users.
Design frameworks exist across numerous different real world applications, from grid systems in typography, to guidelines for electronic safety measures, to graphics card socket sizes. It’s no different in software applications and many companies design their own frameworks to suit their specific brand or vision.
Software is a continuum that will need constant upgrades and attention to meet the demand of it’s users, and having a solid design framework in place to make this more accessible to developers is not something we want to be without.
The Problem.
Our core features and applications need to be tied together visually as opposed to being separate entities without any interlinked design relationships. We need the ability to scale our applications.
Currently the Brand, Website and Core features only have fairly loose design relationships with each other (colour scheme and choices of typography). This is not ideal and will only bog down future application and web development in the future. Therefore, action must be taken to ensure we have the correct tools and elements for our current, and future developers to use, build upon and easily understand.
While it can be beneficial to experiment, this directly affects user experience and brand recognition, these things are massively important and needs to be addressed. This is not to stop testing and pushing the limits of user experience, but it is much more ideal to have room for experimentation on less important parts of our core infrastructure.
Feedback from our users.
As we are committed to our user base, we’ve been reading suggestions to better understand their needs. Feedback of any kind of is greatly beneficial to the project, and we value it.
What can be gathered from the feedback is that our users want things that these types of software applications really should have by now, which is a clean, easy to understand experience without unnecessary clicking around or confusing UI flows. That’s where the majority of complaints originate and I can empathize. Excluding a few projects it doesn’t seem like many cryptocurrency developers put the user experience first on the list of things to consider when they build their applications.
We will be building this framework with user experience as our driving force.
Why build a framework for Bulwark?
We at Bulwark believe that a cornerstone to user adoption, accessibility, and brand recognition is strong UX and visual design.
While it is beneficial to have a unique and pleasing aesthetic, there are much more critical issues that can be solved with a strong design framework, some of these issues are, and not limited to:
- User understanding & use flow
- Marketing campaign efficiency
- Open Source developer contributions to the project
- Scalability
- Appeal to prospective partners
Tasks.
Construct an internal design guideline & mantra for developers to reference.
We will be referencing Material design for our implementation and animation flow while taking inspiration from other popular UI frameworks.
Design Components for use in all planned applications and leave sufficient headroom for additional development of components not yet conceived.
Develop style guide for Web and Mobile use.
User Interface Flow charts.
Animation guide for specific components.
Construct Design & JS Framework.
Design layout and construct Explorer 2.
Design layout and construct Wallet (Desktop & Mobile).
Marketing Material for BDF.
…And much more.
A Brand within a brand.
Saul Bass said it best with,
“Logos are a graphic extension of the internal realities of a company.”
So we’ll leave it at that, I suppose..
What’s the Stack?
Chosen Frameworks for BDF Applications:
SASS/Stylesheets
- Custom cross platform component library and design language.
JS
- Fullstack React\Redux\React-Router\React Native.
- ElectronJS for Desktop
RPC
- Custom Bitcoin inspired JS RPC
What are we using for Development?
Team Collaboration:
- Asana
- Invision
- Web Conferencing
Designer Tools:
- Adobe Photoshop
- Adobe Illustrator
- Adobe XD
- Sketch w/ Sketchpacks
- IconJar
Developer Tools:
- VSC
- NPM
- GitHub Pages
- Homebrew (MacOS)
- TravisCI
- Sublime Text
- GitKraken
What have we done so far?
With three of us from the Bulwark team working on this project we have so far made some good progress and we are laying the foundations of the framework. An initial first draft of designs have been done and we have chosen the front-end stack and base frameworks we are going to start with.
Some initial prototypes as seen in above pictures have been made to present to the rest of the team and to better get a feel of what we are going for visually.
The base style has been completed as well as our initial Repo for constructing the components. We’ve started building some of the more basic elements, albeit with upcoming changes in mind, just to get the ball rolling.
Work on a second draft of designs and adjustments is in progress which we hope will tighten up some of the components so that less guess work will have to be done in the building stages.
A commitment to the Open Source Community
With all of our work, we plan to release all of these tools and assets publicly when we feel they are complete enough to be of good use. We hope this will encourage other devs in the Cryptocurrency space to develop design systems for their projects if they have not done so already, and for end users to be more aware and perceptive of design and the role it plays in software interaction, so that they can give feedback if they wish to do so.
As it has been stated previously, we really do believe strong UX and visual design is extremely important and plays a huge role in the quest for further mainstream user adoption. Through supplying these frameworks and tools to the open source community, and by showing the design process we hope to play our part in raising awareness and improvement of user experience in the cryptocurrency space.
That’s it for now.
Thanks for reading our brief update and introduction to the BDF, expect more updates as we progress and hit some of our development milestones.
Bye.
