การออกแบบอะตอม (Atomic design) คือระเบียบวิธีในการสร้างระบบอินเทอร์เฟซโดยการประกอบชิ้นส่วนเล็กๆ ที่สามารถนำกลับมาใช้ใหม่ได้ เข้าด้วยกันเป็นโครงสร้างที่ใหญ่ขึ้นเรื่อยๆ ระเบียบวิธีนี้ได้รับการแนะนำโดยแบรด ฟรอสต์ ในปี 2013 โดยใช้คำอุปมาทางเคมีและกำหนดระดับไว้ห้าระดับ ได้แก่ อะตอม (Atoms) ซึ่งเป็นองค์ประกอบที่เล็กที่สุดที่ไม่สามารถแบ่งแยกได้ เช่น ป้ายกำกับ ช่องป้อนข้อมูล และปุ่มต่างๆ โมเลกุล (Molecules) ซึ่งเป็นกลุ่มอย่างง่าย เช่น ช่องค้นหาที่มีป้ายกำกับและปุ่ม สิ่งมีชีวิต (Organisms) ซึ่งเป็นส่วนประกอบที่ซับซ้อนมากขึ้น เช่น ส่วนหัวของเว็บไซต์หรือการ์ดข้อมูลผลิตภัณฑ์ เทมเพลต (Templates) ซึ่งเป็นโครงสร้างหน้าเว็บที่มีตัวยึดตำแหน่งเนื้อหา และหน้าเว็บ (Pages) ซึ่งเป็นเทมเพลตที่ใส่เนื้อหาจริงเข้าไปแล้ว
ข้อดีของระเบียบวิธีนี้คือการสร้างคำศัพท์ร่วมกันสำหรับการตัดสินใจที่ทีมออกแบบส่วนติดต่อผู้ใช้ทุกทีมทำโดยปริยาย: อะไรคือส่วนประกอบ อะไรคือองค์ประกอบ และการนำกลับมาใช้ใหม่เริ่มต้นที่ใด หากไม่มีกรอบการทำงาน ทีมต่างๆ จะสร้างหน้าจอแยกกัน ทำซ้ำองค์ประกอบที่คล้ายกันโดยมีการเปลี่ยนแปลงเล็กน้อย และลงเอยด้วยปุ่มและการ์ดที่แตกต่างกันเล็กน้อยหลายสิบรายการซึ่งต้องได้รับการดูแลรักษาทีละรายการ การออกแบบอะตอมิกให้โครงสร้างสำหรับการระบุหน่วยที่นำกลับมาใช้ใหม่ได้และสำหรับการตัดสินใจว่าส่วนประกอบใดของส่วนติดต่อผู้ใช้ควรอยู่ในระดับใด
ประโยชน์ในทางปฏิบัติจะปรากฏให้เห็นในขั้นตอนการบำรุงรักษามากกว่าการสร้างเริ่มต้น การเปลี่ยนแปลงองค์ประกอบพื้นฐานจะอัปเดตทุกอย่างที่ประกอบขึ้นจากองค์ประกอบนั้น ดังนั้นการเปลี่ยนแปลงรูปแบบการโฟกัสหรือระยะห่างจะส่งผลอย่างสม่ำเสมอแทนที่จะต้องค้นหาไปทั่วทั้งโค้ด สามารถประกอบหน้าจอใหม่จากชิ้นส่วนที่มีอยู่ ซึ่งช่วยลดระยะเวลาการส่งมอบและลดจำนวนการตัดสินใจที่แต่ละหน้าใหม่ต้องการ การประกันคุณภาพและการเข้าถึงจะมุ่งเน้นที่ระดับส่วนประกอบ ซึ่งการใช้งานที่ถูกต้องเพียงครั้งเดียวก็เพียงพอต่อการใช้งานทุกอย่าง แทนที่จะต้องทำซ้ำในแต่ละหน้า
วิธีการนี้ได้รับการวิพากษ์วิจารณ์อย่างสมเหตุสมผล โดยส่วนใหญ่เกี่ยวกับความตรงตัวเกินไป ทีมต่างๆ ใช้ความพยายามมากเกินไปในการถกเถียงว่าองค์ประกอบที่กำหนดนั้นเป็นโมเลกุลหรือสิ่งมีชีวิต ซึ่งเป็นการถกเถียงทางอนุกรมวิธานที่ไม่มีผลในทางปฏิบัติ นอกจากนี้ การเปรียบเทียบกับวิชาเคมีก็ใช้ไม่ได้ผลเมื่อพิจารณาถึงขอบเขต และสื่อสารได้ไม่ดีสำหรับผู้ที่ไม่ใช่นักออกแบบ ทีมที่มีประสบการณ์ส่วนใหญ่ถือว่าระดับต่างๆ เป็นเพียงแนวทางคร่าวๆ โดยมักจะลดทอนให้เหลือเพียงการแบ่งแยกที่ง่ายกว่า เช่น องค์ประกอบพื้นฐาน ส่วนประกอบ และรูปแบบ และมุ่งเน้นไปที่หลักการพื้นฐานของการประกอบมากกว่าการจำแนกประเภทที่ถูกต้อง
การสร้างนามธรรมมากเกินไปเป็นความเสี่ยงที่ร้ายแรงกว่า การสร้างไลบรารีส่วนประกอบก่อนที่จะรู้ว่าผลิตภัณฑ์ต้องการอะไรจริงๆ จะทำให้เกิดส่วนประกอบที่ออกแบบมาสำหรับกรณีที่จินตนาการไว้ โดยมีตัวเลือกการกำหนดค่ามากเกินไปและวัตถุประสงค์ที่ไม่ชัดเจน ลำดับที่น่าเชื่อถือกว่าคือการสร้างหน้าจอ สังเกตการทำซ้ำที่แท้จริง และแยกส่วนประกอบออกมาเมื่อรูปแบบนั้นปรากฏขึ้นหลายครั้งในการใช้งานจริง การสร้างนามธรรมก่อนเวลาอันควรนั้นแก้ไขได้ยากกว่าการทำซ้ำ เพราะผู้ใช้ส่วนประกอบแต่ละรายจะจำกัดวิธีการเปลี่ยนแปลงของส่วนประกอบนั้น
คุณค่าของวิธีการนี้ขึ้นอยู่กับการกำกับดูแลที่ตัวมันเองไม่ได้ให้ไว้ ไลบรารีส่วนประกอบที่ไม่มีความเป็นเจ้าของที่ชัดเจน กฎการมีส่วนร่วม และกระบวนการยกเลิกการใช้งาน จะสะสมรูปแบบต่างๆ มากมาย เช่น การ์ดสามใบที่แตกต่างกันเล็กน้อย ส่วนประกอบปุ่มสองชิ้นที่มีวัตถุประสงค์ซ้ำซ้อน และชุดการแก้ไขแบบครั้งเดียวที่เพิ่มขึ้นเรื่อยๆ ซึ่งถูกนำมาใช้เพราะส่วนประกอบที่มีอยู่เกือบจะพอดี การตัดสินใจว่าใครจะเป็นผู้ให้การอนุมัติส่วนประกอบใหม่ วิธีที่ทีมร้องขอการเปลี่ยนแปลงส่วนประกอบที่ใช้ร่วมกัน และวิธีการลบรูปแบบที่ยกเลิกการใช้งานออกจากระบบที่มีอยู่ มีความสำคัญต่อความสม่ำเสมอในระยะยาวมากกว่าการจัดหมวดหมู่ องค์กรที่สร้างการกำกับดูแลนี้จะพบว่าไลบรารีช่วยลดภาระงานลงเมื่อเวลาผ่านไป ส่วนองค์กรที่ไม่สร้างการกำกับดูแลนี้จะพบว่ามันกลายเป็นอีกหนึ่งพื้นผิวที่ไม่สอดคล้องกันซึ่งต้องมีการบำรุงรักษาควบคู่ไปกับโค้ดที่มันตั้งใจจะทำให้ง่ายขึ้น
ในแง่ของการส่งมอบ วิธีการนี้จะได้ผลดีที่สุดเมื่อไลบรารีการออกแบบและไลบรารีโค้ดมีความสอดคล้องกันแบบหนึ่งต่อหนึ่ง กล่าวคือ ส่วนประกอบในเครื่องมือออกแบบจะมีเวอร์ชันเดียวที่มีชื่อเดียวกันและรูปแบบเดียวกัน การสร้างความสอดคล้องกันนี้เป็นความรับผิดชอบร่วมกันของทุกฝ่าย ออกแบบผลิตภัณฑ์ และ การพัฒนาผลิตภัณฑ์และนี่คือสิ่งที่กำหนดว่าระบบการออกแบบจะช่วยลดภาระงานหรือเพียงแค่เพิ่มสิ่งที่จะต้องดูแลรักษาควบคู่ไปกับโค้ดอีกชิ้นหนึ่ง