tripledio.github.io/index.html at master · tripledio/tripledio.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
---
layout: default
title: "Home"
weight: 0

spotlight:
    imgDir: /img/spotlight/home
    imgAlt: "Triple D : Design, Develop, Deploy"
    logoAnimation: true
    video: false
    videoFile: files/electric.mp4
qotd:
    enabled: true
---

<section id="intro" class="py-6 py-md-10 bg-white text-gray">
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-10 col-lg-8 offset-0 offset-md-1 offset-lg-2 px-md-4 text-center">
                <p class="font-size-4 mb-4" style="animation: fadeInUp 1s ease-out forwards; opacity: 0;">{{ '**Triple D** is a Belgian software development company founded and composed entirely of seasoned software engineers. Intentionally
                    remaining a small, independent firm, **Triple D** leverages its extensive collective experience to cultivate a clear vision for successful
                    software development.' | markdownify }}</p>
                <hr class="slab center w-25" style="animation: fadeInUp 1.2s ease-out forwards; opacity: 0;">
            </div>
        </div>
    </div>
</section>
<section id="aboutus" class="py-6 py-md-10 bg-white text-gray">
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-6 px-md-4 px-lg-5 mb-5 mb-md-0" style="animation: fadeInUp 0.8s ease-out forwards; opacity: 0;">
                <div class="p-4 p-md-5 h-100" style="border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;">
                    <h2 class="h3 text-uppercase text-center mb-4">Who are we</h2>
                    <hr class="slab center w-10 mt-2 mb-4">
                    <p>{{'We are a team of passionate software engineers who felt unsatisfied with the dominant approach to software delivery. As seasoned veterans,
                        we founded **Triple D** as a haven for like-minded individuals who share our desire to elevate the standards. We&rsquo;re proud to be more
                        than your typical consultancy firm—you&rsquo;ll notice the difference' | markdownify }}</p>
                </div>
            </div>
            <div class="col-12 col-md-6 px-md-4 px-lg-5" style="animation: fadeInUp 1.2s ease-out forwards; opacity: 0;">
                <div class="p-4 p-md-5 h-100" style="border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;">
                    <h2 class="h3 text-uppercase text-center mb-4">What drives us</h2>
                    <hr class="slab center w-10 mt-2 mb-4">
                    <p>{{ 'Our main drive is to deliver software that meets your needs and stands the test of time. We aim to create products that provide long-term
                        returns on your investment. Since design, development and deployment are all interconnected parts in the iterative software development
                        process we&rsquo;re dedicated to owning it all. So we can deliver quality software that&rsquo;s truly worth the investment.' | markdownify
                        }}</p>
                </div>
            </div>
        </div>
    </div>
</section>
<section id="ourname" class="py-6 py-md-10 bg-white text-gray">
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-6 px-md-4 px-lg-5 mb-5 mb-md-0" style="animation: fadeInUp 0.8s ease-out forwards; opacity: 0;">
                <div class="p-4 p-md-5 h-100" style="border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;">
                    <h2 class="h3 text-uppercase text-center mb-4">Our name</h2>
                    <hr class="slab center w-10 mt-2 mb-4">
                    <p>{{ 'Our name, **Triple D**, encapsulates multiple facets of our identity. It signifies the comprehensive process of *D*esign, *D*evelop, *D*eploy, underscoring our expertise and commitment to excellence across all these stages. Additionally, it serves as a homage to essential development practices: *Test Driven Development*, *Behaviour Driven Development*, and *Domain Driven Design*—methodologies we vigorously embrace and implement.'| markdownify }}</p>
                </div>
            </div>
            <div class="col-12 col-md-6 px-md-4 px-lg-5" style="animation: fadeInUp 1.2s ease-out forwards; opacity: 0;">
                <div class="p-4 p-md-5 h-100" style="border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;">
                    <h2 class="h3 text-uppercase text-center mb-4">Our Logo</h2>
                    <hr class="slab center w-10 mt-2 mb-4">
                    <p>{{'Both our name and logo are designed to reflect our iterative approach to software development. The interlocking D&rsquo;s in our logo symbolize the seamless transition and continuous cycle between each phase of our work. The colors of our logo represent the three stages of *Test Driven Development*: <span class="text-red">Red</span> for writing a failing test, <span class="text-green">Green</span> for making the test pass, and <span class="text-blue">Blue</span> for the phase of refactoring and enhancing the code. This, like everything we do, underscores our dedication to a <u>disciplined, quality-driven, iterative development process</u>.' | markdownify
                    }}</p>
                </div>
            </div>
        </div>
    </div>
</section>


<section id="services" class="py-6 py-md-10">
    <div class="container">
        <div class="row">
            <div class="col-12 text-center mb-5" style="animation: fadeInUp 0.6s ease-out forwards; opacity: 0;">
                <h2 class="h3 mb-3 text-uppercase">Our services</h2>
                <hr class="slab center w-10 mt-2 mb-0">
            </div>
        </div>
    </div>
    <div class="partial-bg primary {% if page.servicesWithoutDescription %}alt{% endif %} pb-md-0">
        <div class="container">
            <div class="row">
                {% for service in site.data.services %}
                <div class="col-12 col-md-4 text-center mb-5" style="animation: fadeInUp 0.9s ease-out forwards; opacity: 0;">
                    <div class="p-4 p-md-5 h-100" style="border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease; background-color: white;">
                        <div class="icon {% if forloop.first %}first{% endif %} {% if forloop.last %}last{% endif %} flex-center-hv py-4">
                            <img src="{{ service.imgPath }}" alt="{{ service.imgAlt }}" style="transition: transform 0.3s ease;">
                        </div>
                        <h3 class="mb-4"><a class="bg-{{ service.color }}" href="{{ service.url }}" style="transition: all 0.3s ease;">{{ service.name }}</a></h3>
                        {% if service.description %}
                        <div class="px-0 px-md-0 px-lg-2">
                            <p>{{ service.description }}</p>
                        </div>
                        {% endif %}
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
    </div>
</section>