Coastal Digital Group

Neptune - WYSIWYG Advertisement Builder Platform

Premier Canadian advertising partner

Website: coastaldigitalgroup.com

App: Neptune


Industries

  • Advertising & Marketing
  • Communications

Services

  • API Integration
  • Cloud Storage Integration
  • Platform Engineering
  • Product Prototyping
  • Workflow Automation

About the App and the Company

Coastal Digital Group sets itself apart from other agencies by providing creative and strategic services. They make sure to put digital ideas at the forefront. They guide their clients through all phases, from strategy to creation to marketing.

Whether it's advertising, design, web, or video they tackle it differently by expanding the boundaries of technology and creativity.

Client Testimonial

Thanks to DivNotes, our editor was completed and launched. Overall, the team managed the project effectively and responded promptly to our needs. They are incredibly knowledgeable and have skills across many disciplines, languages, frameworks, etc.

They also built a solid foundation for future upgrades. We have a product that has been iterated on since then and still has the ability to add on. Overall we are very happy.

Aaron Merlino
CTO

The Ask

Coastal Digital Group approached DivNotes to build a new proprietary platform called "Neptune" to enable Coastal Digital Group’s clients and internal staff to create Campaign Advertisements using a custom-built What-You-See is What-You-Get (WYSIWYG) Advertisement Builder.


Product Development

For this particular build, the software application had to work with an existing backend solution. We adopted the backend code that was built by the Coastal Digital Group backend development team and worked closely with them during the Frontend Software Implementation process to provide direction on the required application programming interface (API) Calls for the Frontend Application.

Technical Feasibility Assessment

During this Product Development process, the technical team evaluated various available off-the-shelf software solutions that could be leveraged for this project based on future project iterations and backlogged features. The technologies leveraged were determined feasible if time and development costs could be saved from this project’s phase. With the requirements and technical stack concluded, the Design Team contributed to the User Experience (UX) discussion alongside the Coastal Digital Group UX Designer to shape the User Interface (UI) around the functionality.

Frontend Software Development

The software application had to work with an existing backend solution. We adopted the backend code built by the Coastal Digital Group backend development team.

Authentication

The platform would require an authentication system that would connect with the aforementioned API. We implemented token-based authentication to retrieve and modify a User’s campaign established from the original website platform.

Drag and Drop Functionality

To perform certain actions, the platform would need Drag and Drop (React-dnd) functionality, along with a Z-Indexing layering management system to manage the placement and order of the creative advertisement components. This functionality was challenging initially, but has proven effective, allowing users to drag layer elements onto the canvas.

Responsive React Frontend Elements

The application was designed as a desktop-friendly interface responsive to various monitor sizes. Users could customize their User Interface (UI) by defining which creative panel tabs to keep open and to which side of their campaign canvas they would assign their tabs, utilizing the Drag and Drop feature.

Multiple Page Advertisement States

Users can manage multiple pages or advertisement sheets, requiring a custom page management tool to handle various states depending on user interaction.

Asset Uploading & Management

Advertisements can consist of multiple asset types, including embedded videos and images. We utilized external tools like Amazon’s Simple Storage System (S3) for asset uploading and collaborated closely with Coastal Digital Group’s Backend Development team.


Technology Stack


Actions & Automatically Triggered Events

Users need to assign events triggered by end-user interaction with the advertisement, such as opening a custom URL on a Click/Tap.


Conclusions & Next Steps

Once the core of the Neptune Advertisement Builder was finalized, it was deployed to a secure staging environment for Quality Assurance Testing by the DivNotes team. The team will return to the Neptune Advertisement Builder to implement new features in the future.


Looking for Reliable Software Solutions?

No matter your software development needs, we’ve got you covered. Let’s start with a free discovery session.