Online Store for "
" by NPH Deutschland e.V.

For the organizational website of the international children’s charity NPH Deutschland e. V., punkt.de implemented a shop extension that allows donors to fund specific relief supplies. Because the team felt it was important to support the children’s charity and its work, it donated a portion of its development time to the project. The result is impressive across the board—and was honored with the TYPO3 Community Award in 2016.

The Current Situation

It is becoming increasingly difficult for charitable organizations to mobilize donors. This is because donors have become more critical: They want absolute transparency regarding how their money is being used—and whether it actually reaches its intended recipients. Not least for this reason, people today prefer to make targeted donations for smaller relief supplies rather than larger aid projects. In response to this trend, nph deutschland e.V. had launched the “MyGoodShop” donation shop in collaboration with another agency, which allowed donors to fund individual relief items such as food or medicine. However, this online shop was separate from the organization’s website, which contains extensive information about the children’s charity’s projects, a fact that often caused confusion among donors. Accordingly, the goal of the collaboration with punkt.de was to create a new online store integrated into the organization’s website—on the one hand, to unify the visual design and technology, and on the other, to bring donation products and projects closer together. At the same time, the new online store was designed to be easy to maintain and to make the donation process as simple as possible for users.

The Challenge

Since the organizational website of nph deutschland e. V. uses the TYPO3 CMS, the online store had to be integrated into this system so that store content could be displayed on the site, links could be created, content would only need to be maintained in a single system, and the shop could be run on its own server if necessary—for example, if traffic to the shop becomes too high. Because the way a CMS works differs significantly from that of a web store system, the goal was to find the right technical framework to combine content-based communication—as found on an organizational website—with the transaction-based mechanisms of a web store. 

At the same time, the online store required by nph deutschland e. V. differed greatly from “conventional” online stores: For example, there were no product variations such as size or color and no shipping address, but instead filters by area of use, background information on each product, and donation certificates were needed. “Donating is different from shopping,” explains Detlef von Houwald, online fundraiser at nph deutschland e. V. “Our online store should therefore not be about getting users to buy lots of expensive products, but rather about making them feel good. That, of course, had implications for the shop’s structure and functionality.” 

Design by made in (from Frankfurt)

The payment function is implemented via an interface to PAYONE

The Solution

Before implementing the project, punkt.de, together with nph deutschland e. V. and the partner agency made in—which was responsible for the web store’s design—created a wireframe to gather ideas and assess their technical feasibility right away. “The entire process was incredibly well thought out and well structured,” reports von Houwald. “Once the wireframe was complete, we got down to the actual work.” To implement the online store, punkt.de, together with nph, chose the Aimeos store system. The system manages the entire shopping process, from product selection through the shopping cart all the way to payment. It also features seamless integration with TYPO3Backend, which allows editors to manage the store using the familiar TYPO3Backend interface. Another advantage: Individual elements of the shop can be integrated via plugins using the familiar TYPO3Backend. Nevertheless, many special customizations were necessary to meet the needs of a donation shop. Features such as sliders, teaser texts, and the use of coupon codes were implemented.

The payment functionality was expanded during the project through an interface with the payment service provider PAYONE. The certified company (https://www.payone.com/DE-de/pci-dss) offers various payment methods and ensures that customers’ payment data is securely stored with PAYONE.

For editors, too, the effort required for data entry is reduced thanks to partially automated processes: Products are easy to manage because predefined categories and attributes simply need to be selected rather than created from scratch each time. The same applies to FAQ entries. In addition, recommendations for other products in the same category are automatically displayed for each product; however, if an editor wants specific products to be displayed, they can choose which ones. Once a donor has funded a product, the donation certificate is automatically generated and sent. The doubling of donations by partners of nph deutschland e. V. for certain relief goods and the display of donation progress for limited-quantity products also work automatically—simply check a small box. Another plus: Shop statistics are displayed directly in the “ Backend.”