SALT-NLP/Design2Code-HARD
This dataset consists of 80 extra difficult webpages from Github Pages, which challenges SoTA multimodal LLMs on converting visual designs into code implementations. Each example is a pair of source HTML and screenshot ({id}.html and {id}.png). See the "easy" version of the Design2Code testset here Note that all images in these webpages are replaced by a placeholder image (rick.jpg) Please refer to our project page and our paper for more information.
6379
1<!DOCTYPE html>2<html lang="en-US">3 <head>4 <style>5 .highlight table td{padding:5px}.highlight table pre{margin:0}.highlight .cm{color:#777772;font-style:italic}.highlight .cp{color:#797676;font-weight:bold}.highlight .c1{color:#777772;font-style:italic}.highlight .cs{color:#797676;font-weight:bold;font-style:italic}.highlight .c,.highlight .cd{color:#777772;font-style:italic}.highlight .err{color:#a61717;background-color:#e3d2d2}.highlight .gd{color:#000000;background-color:#ffdddd}.highlight .ge{color:#000000;font-style:italic}.highlight .gr{color:#aa0000}.highlight .gh{color:#797676}.highlight .gi{color:#000000;background-color:#ddffdd}.highlight .go{color:#888888}.highlight .gp{color:#555555}.highlight .gs{font-weight:bold}.highlight .gu{color:#aaaaaa}.highlight .gt{color:#aa0000}.highlight .kc{color:#000000;font-weight:bold}.highlight .kd{color:#000000;font-weight:bold}.highlight .kn{color:#000000;font-weight:bold}.highlight .kp{color:#000000;font-weight:bold}.highlight .kr{color:#000000;font-weight:bold}.highlight .kt{color:#445588;font-weight:bold}.highlight .k,.highlight .kv{color:#000000;font-weight:bold}.highlight .mf{color:#009999}.highlight .mh{color:#009999}.highlight .il{color:#009999}.highlight .mi{color:#009999}.highlight .mo{color:#009999}.highlight .m,.highlight .mb,.highlight .mx{color:#009999}.highlight .sb{color:#d14}.highlight .sc{color:#d14}.highlight .sd{color:#d14}.highlight .s2{color:#d14}.highlight .se{color:#d14}.highlight .sh{color:#d14}.highlight .si{color:#d14}.highlight .sx{color:#d14}.highlight .sr{color:#009926}.highlight .s1{color:#d14}.highlight .ss{color:#990073}.highlight .s{color:#d14}.highlight .na{color:#008080}.highlight .bp{color:#797676}.highlight .nb{color:#0086B3}.highlight .nc{color:#445588;font-weight:bold}.highlight .no{color:#008080}.highlight .nd{color:#3c5d5d;font-weight:bold}.highlight .ni{color:#800080}.highlight .ne{color:#990000;font-weight:bold}.highlight .nf{color:#990000;font-weight:bold}.highlight .nl{color:#990000;font-weight:bold}.highlight .nn{color:#555555}.highlight .nt{color:#000080}.highlight .vc{color:#008080}.highlight .vg{color:#008080}.highlight .vi{color:#008080}.highlight .nv{color:#008080}.highlight .ow{color:#000000;font-weight:bold}.highlight .o{color:#000000;font-weight:bold}.highlight .w{color:#bbbbbb}.highlight{background-color:#f8f8f8}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}body{box-sizing:border-box;color:#373737;background:#212121;font-size:16px;font-family:'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{margin:10px 0;font-weight:700;color:#222222;font-family:'Lucida Grande', 'Calibri', Helvetica, Arial, sans-serif;letter-spacing:-1px}h1{font-size:36px;font-weight:700}h2{padding-bottom:10px;font-size:32px;background:url("../images/bg_hr.png") repeat-x bottom}h3{font-size:24px}h4{font-size:21px}h5{font-size:18px}h6{font-size:16px}p{margin:10px 0 15px 0}footer p{color:#f2f2f2}a{text-decoration:none;color:#0F79D0;text-shadow:none;transition:color 0.5s ease;transition:text-shadow 0.5s ease;-webkit-transition:color 0.5s ease;-webkit-transition:text-shadow 0.5s ease;-moz-transition:color 0.5s ease;-moz-transition:text-shadow 0.5s ease;-o-transition:color 0.5s ease;-o-transition:text-shadow 0.5s ease;-ms-transition:color 0.5s ease;-ms-transition:text-shadow 0.5s ease}a:hover,a:focus{text-decoration:underline}footer a{color:#F2F2F2;text-decoration:underline}em,cite{font-style:italic}strong{font-weight:bold}img{position:relative;margin:0 auto;max-width:739px;padding:5px;margin:10px 0 10px 0;border:1px solid #ebebeb;box-shadow:0 0 5px #ebebeb;-webkit-box-shadow:0 0 5px #ebebeb;-moz-box-shadow:0 0 5px #ebebeb;-o-box-shadow:0 0 5px #ebebeb;-ms-box-shadow:0 0 5px #ebebeb}p img{display:inline;margin:0;padding:0;vertical-align:middle;text-align:center;border:none}pre,code{color:#222;background-color:#fff;font-family:Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace;font-size:14px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px}pre{padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.1);overflow:auto}code{padding:3px;margin:0 3px;box-shadow:0 0 10px rgba(0,0,0,0.1)}pre code{display:block;box-shadow:none}blockquote{color:#666;margin-bottom:20px;padding:0 0 0 20px;border-left:3px solid #bbb}ul,ol,dl{margin-bottom:15px}ul{list-style-position:inside;list-style:disc;padding-left:20px}ol{list-style-position:inside;list-style:decimal;padding-left:20px}dl dt{font-weight:bold}dl dd{padding-left:20px;font-style:italic}dl p{padding-left:20px;font-style:italic}hr{height:1px;margin-bottom:5px;border:none;background:url("../images/bg_hr.png") repeat-x center}table{border:1px solid #373737;margin-bottom:20px;text-align:left}th{font-family:'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;padding:10px;background:#373737;color:#fff}td{padding:10px;border:1px solid #373737}form{background:#f2f2f2;padding:20px}.outer{width:100%}.inner{position:relative;max-width:640px;padding:20px 10px;margin:0 auto}#forkme_banner{display:block;position:absolute;top:0;right:10px;z-index:10;padding:10px 50px 10px 10px;color:#fff;background:url("../images/blacktocat.png") #0090ff no-repeat 95% 50%;font-weight:700;box-shadow:0 0 10px rgba(0,0,0,0.5);border-bottom-left-radius:2px;border-bottom-right-radius:2px}#header_wrap{background:#212121;background:-moz-linear-gradient(top, #373737, #212121);background:-webkit-linear-gradient(top, #373737, #212121);background:-ms-linear-gradient(top, #373737, #212121);background:-o-linear-gradient(top, #373737, #212121);background:linear-gradient(to top, #373737, #212121)}#header_wrap .inner{padding:50px 10px 30px 10px}#project_title{margin:0;color:#fff;font-size:42px;font-weight:700;text-shadow:#111 0px 0px 10px}#project_tagline{color:#fff;font-size:24px;font-weight:300;background:none;text-shadow:#111 0px 0px 10px}#downloads{position:absolute;width:210px;z-index:10;bottom:-40px;right:0;height:70px;background:url("../images/icon_download.png") no-repeat 0% 90%}.zip_download_link{display:block;float:right;width:90px;height:70px;text-indent:-5000px;overflow:hidden;background:url(../images/sprite_download.png) no-repeat bottom left}.tar_download_link{display:block;float:right;width:90px;height:70px;text-indent:-5000px;overflow:hidden;background:url(../images/sprite_download.png) no-repeat bottom right;margin-left:10px}.zip_download_link:hover{background:url(../images/sprite_download.png) no-repeat top left}.tar_download_link:hover{background:url(../images/sprite_download.png) no-repeat top right}#main_content_wrap{background:#f2f2f2;border-top:1px solid #111;border-bottom:1px solid #111}#main_content{padding-top:40px}#footer_wrap{background:#212121}@media screen and (max-width: 992px){img{max-width:100%}}@media screen and (max-width: 480px){body{font-size:14px}#downloads{display:none}.inner{min-width:320px;max-width:480px}#project_title{font-size:32px}h1{font-size:28px}h2{font-size:24px}h3{font-size:21px}h4{font-size:18px}h5{font-size:14px}h6{font-size:12px}code,pre{font-size:11px}}@media screen and (max-width: 320px){body{font-size:14px}#downloads{display:none}.inner{min-width:240px;max-width:320px}#project_title{font-size:28px}h1{font-size:24px}h2{font-size:21px}h3{font-size:18px}h4{font-size:16px}h5{font-size:14px}h6{font-size:12px}code,pre{min-width:240px;max-width:320px;font-size:11px}}@media only screen and (min-width: 500px){#main_content_wrap h2:not(.long){position:sticky;z-index:1;top:0;background:#f2f2f2;margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}}6 </style>7 <meta charset="utf-8">8 <meta content="IE=edge" http-equiv="X-UA-Compatible">9 <meta content="width=device-width,maximum-scale=2" name="viewport">10 <style class="anchorjs">11 </style>12 </head>13 <body>14 <!-- HEADER -->15 <div class="outer" id="header_wrap">16 <header class="inner">17 <a id="forkme_banner">18 View on GitHub19 </a>20 <h1 id="project_title">21 Architectural Decision Records22 </h1>23 <h2 id="project_tagline">24 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">25 </a>26 Homepage of the ADR GitHub organization27 </h2>28 </header>29 </div>30 <!-- MAIN CONTENT -->31 <div class="outer" id="main_content_wrap">32 <section class="inner" id="main_content">33 <h1 id="architectural-decision-records-adrs">34 Architectural Decision Records (ADRs)35 </h1>36 <p>37 An38 <a>39 Architectural Decision (AD)40 </a>41 is a justified design choice that addresses a functional or non-functional requirement that is architecturally significant.42An43 <a>44 Architecturally Significant Requirement (ASR)45 </a>46 is a requirement that has a measurable effect on the architecture and quality of a software and/or hardware system.47An48 <em>49 Architectural Decision Record (ADR)50 </em>51 captures a single AD and its rationale;52the collection of ADRs created and maintained in a project constitute its53 <em>54 decision log55 </em>56 .57All these are within the topic of Architectural Knowledge Management (AKM), but ADR usage can be extended to design and other decisions (“any decision record”).58 </p>59 <p>60 The aim of the61 <a>62 GitHub adr organization63 </a>64 is to:65 </p>66 <ol>67 <li>68 Motivate the need for and benefits of AD capturing and establish a common vocabulary.69 </li>70 <li>71 Strengthen the tooling around ADRs, in support of agile practices as well as iterative and incremental engineering processes.72 </li>73 <li>74 Provide pointers to public knowledge in the context of AKM and ADRs.75 </li>76 </ol>77 <!-- > Note: The term "architecture decision record" can be used interchangeably. -->78 <p>79 The repository for the Website of the ADR organization is80 <a>81 https://github.com/adr/adr.github.io82 </a>83 .84 </p>85 <h2 id="adrs-in-the-media">86 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">87 </a>88 ADRs in the Media89 </h2>90 <ul>91 <li>92 <a>93 Love Unrequited: The Story of Architecture, Agile, and How Architecture Decision Records Brought Them Together94 </a>95 , Michael Keeling in the Pragmatic Designer column of IEEE Software Vol. 39 Issue 4 (2022) (96 <a>97 PDF98 </a>99 )100 </li>101 <li>102 Chapter 3 of103 <a>104 “Patterns for API Design: Simplifying Integration with Loosely Coupled Message Exchanges”105 </a>106 in the Addison Wesley Signature Series at Pearson features six narratives guiding through the conceptual level of API design: 29 recurring decisions with options and criteria. Learn more in this107 <a>108 blog post109 </a>110 .111 </li>112 <li>113 Architectural decision capturing is positioned as one of the essential activities in114 <a>115 Design Practice Reference116 </a>117 , a LeanPub e-Book.118 </li>119 <li>120 (German)121 <a>122 Gut dokumentiert: Architecture Decision Records123 </a>124 by125 <a>126 @obfischer127 </a>128 published at129 <a>130 heise online131 </a>132 .133 </li>134 </ul>135 <!-- markdownlint-disable-next-line MD022 -->136 <h2 class="long" id="lightweight-adrs-should-be-adopted">137 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">138 </a>139 Lightweight ADRs Should be Adopted140 </h2>141 <p>142 A “lightweight” ADR consists of143 <a>144 title, status, context, decision, and consequences145 </a>146 (according to147 <a>148 [Username Redacted]149 </a>150 ).151 <a>152 ThoughtWorks153 </a>154 listed architectural decision records as “adopt” at their155 <a>156 technology radar vol. 18157 </a>158 :159 <a>160 https://www.thoughtworks.com/en-us/radar/techniques/lightweight-architecture-decision-records161 </a>162 </p>163 <p>164 We think that the considered options with their pros and cons are crucial to understand the reason of a chosen option.165 <a>166 MADR167 </a>168 — The Markdown Any/Architecture Decision Records (MADR:169 <code class="language-plaintext highlighter-rouge">170 [ˈmæɾɚ]171 </code>172 ) in this ADR organization includes such tradeoff analysis information.173 </p>174 <h2 id="relation-of-adrs-madr-and-others">175 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">176 </a>177 Relation of ADRs, MADR, and Others178 </h2>179 <p>180 <img alt="ADR" src="rick.jpg">181 </p>182 <h2 id="sustainable-architectural-decisions">183 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">184 </a>185 Sustainable Architectural Decisions186 </h2>187 <p>188 We base our work on the guidelines and principles in189 <a>190 Sustainable Architectural Decisions191 </a>192 by Zdun et al., for instance the Y-statement format suggested in that article.193However, we are open to other formats of ADRs as shown at194 <a>195 @joelparkerhenderson’s repository196 </a>197 .198 </p>199 <p>200 In short, the Y-statement is as follows:201 </p>202 <blockquote>203 <p>204 In the context of205 <code class="language-plaintext highlighter-rouge">206 <use case/user story u>207 </code>208 , facing209 <code class="language-plaintext highlighter-rouge">210 <concern c>211 </code>212 we decided for213 <code class="language-plaintext highlighter-rouge">214 <option o>215 </code>216 to achieve217 <code class="language-plaintext highlighter-rouge">218 <quality q>219 </code>220 , accepting221 <code class="language-plaintext highlighter-rouge">222 <downside d>223 </code>224 .225 </p>226 </blockquote>227 <p>228 The long form of it is as follows (extra section “because”):229 </p>230 <blockquote>231 <p>232 In the context of233 <code class="language-plaintext highlighter-rouge">234 <use case/user story u>235 </code>236 ,237facing238 <code class="language-plaintext highlighter-rouge">239 <concern c>240 </code>241 we decided for242 <code class="language-plaintext highlighter-rouge">243 <option o>244 </code>245 and neglected246 <code class="language-plaintext highlighter-rouge">247 <other options>248 </code>249 ,250to achieve251 <code class="language-plaintext highlighter-rouge">252 <system qualities/desired consequences>253 </code>254 ,255accepting256 <code class="language-plaintext highlighter-rouge">257 <downside d/undesired consequences>258 </code>259 ,260because261 <code class="language-plaintext highlighter-rouge">262 <additional rationale>263 </code>264 .265 </p>266 </blockquote>267 <p>268 You can find more explanations and examples on Medium269 <a>270 Y-Statements - A Light Template for Architectural Decision Capturing271 </a>272 .273 </p>274 <p>275 <a>276 A Definition of Done for Architectural Decision Making277 </a>278 proposes five criteria and a checklist to decide when it is time to set the status of a single decision to “done”: evidence, criteria and alternatives, agreement, documentation, and realization/review plan. Here, we focus on the ‘D’ in279 <em>280 ecADR281 </em>282 .283 </p>284 <h2 id="existing-adr-templates">285 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">286 </a>287 Existing ADR Templates288 </h2>289 <ul>290 <li>291 Overview:292 <a>293 Architectural Decision Records294 </a>295 : collection of markdown templates converted to Markdown296 </li>297 <li>298 <a>299 MADR300 </a>301 : The Markdown Architecture Decision Records (MADR:302 <code class="language-plaintext highlighter-rouge">303 [ˈmæɾɚ]304 </code>305 ).306 <a>307 matter308 <code class="language-plaintext highlighter-rouge">309 [ˈmæɾɚ]310 </code>311 </a>312 .313 </li>314 <li>315 Comparison of seven templates:316 <a>317 Architectural Decision Guidance Across Projects - Problem Space Modeling, Decision Backlog Management and Cloud Computing Knowledge318 </a>319 . WICSA 2015: 85-94.320 </li>321 <li>322 Context, background and examples of good and bad justifications can be found in323 <a>324 this blog post325 </a>326 .327 </li>328 </ul>329 <h2 id="good-adrs-and-how-to-get-to-them">330 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">331 </a>332 Good ADRs (and how to get to them)333 </h2>334 <ul>335 <li>336 <a>337 How to create ADRs — and how not to338 </a>339 collects good practices and anti-patterns340 </li>341 <li>342 <a>343 Architectural Significance Test and Some Core Decisions344 </a>345 </li>346 <li>347 <a>348 The Markdown ADR (MADR) Template Explained and Distilled349 </a>350 </li>351 <li>352 Proposal for353 <a>354 A Definition of Done for Architectural Decision Making355 </a>356 </li>357 </ul>358 <h2 id="decision-capturing-tools">359 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">360 </a>361 Decision Capturing Tools362 </h2>363 <p>364 <em>365 Disclaimer:366 </em>367 The following list is rather inclusive.368Please find out about the status and the maturity of the list entries for yourself by following the links.369We are happy to include more candidate assets here.370 </p>371 <ul>372 <li>373 <a>374 adr-manager375 </a>376 : Craft MADR 2.x templates directly in the Web Browser.377 </li>378 <li>379 <a>380 adr-tools381 </a>382 - bash scripts to manage ADRs in the383 <a>384 Nygard format385 </a>386 .387 <a>388 example389 </a>390 .391 <ul>392 <li>393 Ansible script to install adr-tools:394 <a>395 ansible-adr-tools396 </a>397 </li>398 <li>399 C# rewrite:400 <a>401 adr-cli402 </a>403 </li>404 <li>405 Go rewrite:406 <a>407 adr408 </a>409 </li>410 <li>411 Java rewrite:412 <a>413 adr-j414 </a>415 </li>416 </ul>417 </li>418 <li>419 <a>420 adr-plugin421 </a>422 - plugin to explore and search ADRs within a backstage based developer portal. Search at scale across mutliple orgs/repos.423 </li>424 <li>425 <a>426 adr-viewer427 </a>428 - python application to generate a website from a set of ADRs.429 </li>430 </ul>431 <p>432 For a more detailed list for tooling for MADR, please head to433 <a>434 https://adr.github.io/madr/tooling.html435 </a>436 .437 </p>438 <h3 id="tooling-related-to-architecture-management">439 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">440 </a>441 Tooling related to architecture management442 </h3>443 <ul>444 <li>445 <a>446 ArchUnit447 </a>448 : unit tests for architecture449 </li>450 <li>451 <a>452 docToolchain453 </a>454 : docToolchain is an implementation of the455 <a>456 docs-as-code457 </a>458 approach for software architecture plus some additional automation.459 </li>460 <li>461 <a>462 Structurizr463 </a>464 : Structurizr is a collection of tooling to help you visualise, document and explore your software architecture using the465 <a>466 C4 model467 </a>468 .469 </li>470 </ul>471 <h3 id="interesting-but-unmaintained-tooling">472 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">473 </a>474 Interesting, but unmaintained tooling475 </h3>476 <ul>477 <li>478 <a>479 adr-log480 </a>481 : Generates an architectural decision log out of MADRs.482 </li>483 <li>484 <a>485 ADMentor486 </a>487 Architectural Decision Modeling Add-In for488 <a>489 Sparx Enterprise Architect490 </a>491 </li>492 <li>493 <a>494 eadlsync495 </a>496 : Synchronizes embedded architectural decision records with a repository of architectural decisions.497 </li>498 <li>499 <a>500 SE Repo501 </a>502 : Software Engineering Repository. A repository for versioning software engineering artifacts, which can be architectural decisions, patterns, and others.503 </li>504 </ul>505 <h2 id="more-information">506 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">507 </a>508 More Information509 </h2>510 <ul>511 <li>512 <a>513 “An Adoption Model for Architectural Decision Making and Capturing”514 </a>515 </li>516 <li>517 <a>518 Architectural Decisions — The Making Of519 </a>520 - provides some history on architecture decision records.521 </li>522 <li>523 <a>524 Architectural Decision Records (ADR): Open & Transparent Decision History525 </a>526 in the Open Practice Library527 </li>528 <li>529 An AWS Prescriptive Guidance recommends530 <a>531 using architectural decision records to streamline technical decision-making for a software development project532 </a>533 .534 </li>535 </ul>536 <!-- - [Work by Daniel Popescu](https://scholar.google.com/citations?user=dASv28sAAAAJ) -->537 <h2 id="contribute">538 <a aria-label="Anchor" class="anchorjs-link" data-anchorjs-icon="" style="font-style: normal; font-variant: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: normal; font-stretch: normal; font-size: 1em; line-height: inherit; font-family: anchorjs-icons; position: absolute; margin-left: -1em; padding-right: 0.5em;">539 </a>540 Contribute541 </h2>542 <p>543 To improve this page, head to544 <a>545 https://github.com/adr/adr.github.io546 </a>547 , edit548 <code class="language-plaintext highlighter-rouge">549 index.md550 </code>551 , and submit a pull request.552 </p>553 </section>554 </div>555 <!-- FOOTER -->556 <div class="outer" id="footer_wrap">557 <footer class="inner">558 <p class="copyright">559 Architectural Decision Records maintained by560 <a>561 adr562 </a>563 </p>564 <p>565 Published with566 <a>567 GitHub Pages568 </a>569 </p>570 </footer>571 </div>572 </body>573</html>574